Lzh on GitHub

集合类型

了解你可以在 Nuxt Content 中定义的两种集合类型。

在 Nuxt Content 中，你可以为每个集合指定一个类型，具体取决于集合文件的预期用途。集合可以定义为 page（页面）或 data（数据）类型。

对于这两种类型，都会生成内置字段。每个集合都包含以下默认字段：

  • id: 唯一内容标识符
  • stem: 不带扩展名的文件路径（用于排序和定位）
  • extension: 文件扩展名
  • meta: 未在集合模式中定义的自定义字段

Page 类型

defineCollection({
  source: '**/*.md',
  type: 'page'
})
如果你的网站上的内容文件和页面之间存在一对一的关系，请使用 page 类型。

路径生成

Nuxt Content 将自动为集合中的每个文件生成路径，从而轻松创建 URL 映射。

以下是基于文件结构生成的路径示例：

FilePath
content/index.md/
content/about.md/about
content/blog/index.md/blog
content/blog/hello.md/blog/hello
content/1.guide/2.installation/guide/installation
你可以使用辅助函数 queryCollection('COLLECTION').path('PATH') 按特定路径检索内容。

模式覆盖

当你使用 page 类型时，Nuxt Content 会生成几个常用的标准字段，这些字段通常用于网页。这些字段提供了结构，并且会 自动 应用于集合的模式：

  • path: 生成的路由路径
  • title: 页面标题
  • description: 页面描述
  • seo: SEO 元数据（与 Nuxt 的 useSeoMeta composable 一起使用）
  • body: 解析为 AST 的页面内容
  • navigation: 页面导航配置（用于 queryCollectionNavigation）

以下是应用的相应模式：

  path: z.string(),
  title: z.string(),
  description: z.string(),
  seo: z.intersection(
    z.object({
      title: z.string().optional(),
      description: z.string().optional(),
      meta: z.array(z.record(z.string(), z.any())).optional(),
      link: z.array(z.record(z.string(), z.any())).optional(),
    }),
    z.record(z.string(), z.any()),
  ).optional().default({}),
  body: z.object({
    type: z.string(),
    children: z.any(),
    toc: z.any(),
  }),
  navigation: z.union([
    z.boolean(),
    z.object({
      title: z.string(),
      description: z.string(),
      icon: z.string(),
    }),
  ]).default(true),
你可以通过在集合的模式中定义这些字段来覆盖其中的任何字段。

Data 类型

defineCollection({
  source: 'authors/**.yml',
  type: 'data'
})

数据类型对于不直接对应于网页，而是表示你可能想要在应用程序中查询和显示的结构化内容非常有用。

使用数据集合，你可以完全控制模式，从而可以定义自定义结构。

集合类型和文件扩展名之间没有严格的关系。例如，page 集合可以使用 Markdown、YAML 或 JSON 文件，而 data 集合也可以使用任何这些格式。

排序文件

对于这两种类型，你可能希望控制列表中条目的显示顺序。在文件名和目录名中使用数字前缀来指定顺序。Nuxt Content 在对内容列表进行排序时将使用这些数字。

Nuxt Content 使用字母顺序进行排序，因此如果你想使用数字顺序，则需要在个位数前加上 0。例如，如果没有 0 前缀，10.foo.md 会排在 2.bar.md 之前。
Directory structure
content/
  1.frameworks/
    1.vue.md
    2.nuxt.md
    ...
  2.examples/
    01.nuxthub.md
    02.vercel.md
    03.netlify.md
    04.heroku.md
    ...
    10.cloudflare.md
    index.md
使用 . 字符分隔数字和文件名。使用任何其他分隔符都将不起作用。