编辑

Docus 提供了满足不同需求的自定义选项。

• 你可以把它集成为一个完整网站方案，同时包含着陆页和文档区域。
• 也可以把文档功能嵌入到 Nuxt 应用中，同时保留对其他部分的完全控制（这得益于 Nuxt layer 功能）。

着陆页

着陆页是访问者在站点根路径 / 看到的第一个页面。

Markdown（默认）

默认情况下，着陆页对应 content/index.md 文件。

Docus 会自动：

• 为 content/index.md 文件创建 landing content collection
• 注册 / 路由来渲染 Markdown 着陆页

Vue（自定义）

Docus 是一个 layer，因此你可以通过在 app/pages/index.vue 创建 Vue 页面来完全自定义着陆页（i18n 设置中可使用 app/pages/[[lang]]/index.vue）。这让你可以使用 Vue 组件、自定义布局和高级交互获得完整控制。

在这种情况下，Docus 会：

• 不创建 landing collection
• 使用原生 Nuxt router，并把 index.vue 视为首页

组件

MDC 提供专门语法，让你可以轻松在内容中使用 Vue 组件：

:::u-page-feature
:::

Slots

Slots 可以接收文本内容或其他组件。

• 默认 slot 会直接渲染到组件内部，也可以使用 #default。
• 具名 slots 使用 # 符号加 slot 名称定义。

:::u-page-feature
  #title
  Nuxt 4
  
  #description
  Powered by Nuxt 4 for optimal performances and SEO.
:::

Props

Props 可以通过内联语法或组件块中的 YAML frontmatter 传入：

:::u-page-feature{icon="i-simple-icons-nuxt" to="https://nuxt.com"}
  #title
  Nuxt 4
  
  #description
  Powered by Nuxt 4 for optimal performances and SEO.
:::

:::u-page-feature
  ---
  icon: i-simple-icons-nuxt
  to: https://nuxt.com
  ---
  #title
  Nuxt 4
  
  #description
  Powered by Nuxt 4 for optimal performances and SEO.
:::

文档页面

不使用 docs 文件夹

要开始使用，只需在 content/ 目录中编辑或添加 .md 文件，页面就会更新。Docus 会自动处理路由、导航和全文搜索。

content/
├── index.md              # Landing page → /
├── getting-started.md    # Documentation → /getting-started
└── guide/
    └── introduction.md   # Documentation → /guide/introduction

使用 docs 文件夹

你也可以选择把文档文件组织在 docs/ 子文件夹中。当 Docus 在 content/ 目录中检测到 docs/ 文件夹时，会自动为所有文档 URL 添加 /docs 前缀。

content/
├── index.md                  # Landing page → /
└── docs/
    ├── getting-started.md    # Documentation → /docs/getting-started
    └── guide/
        └── introduction.md   # Documentation → /docs/guide/introduction

混合内容

Docus 是一个 Nuxt layer，因此你可以把 Markdown 文件和自定义 Vue 页面组合使用：

├── app/
│   └── pages/
│       ├── pricing.vue       # Custom pricing page → /pricing
│       └── contact.vue       # Custom contact page → /contact
└── content/
    ├── index.md              # Landing page → /
    └── blog.md               # Blog page → /blog
    └── docs/                 # Documentation → /docs/*
        ├── getting-started.md
        └── api/
            └── reference.md

这种结构让你可以灵活地用 Docus 构建完整网站。使用 Markdown 编写文档，并用 Vue 页面实现博客、仪表盘或任意交互式页面等自定义功能。

Frontmatter

content/ 文件夹中的每个文件都会在页面顶部以 --- 语法开头。这对应文件的 frontmatter，是基于 Markdown 的 CMS 用来为页面提供元数据的约定。

CodePreview

content/getting-started/edition.md

---
title: 'Edition'
description: 'Learn how to write your documentation.'
---

<!-- Content of the page in pure Markdown -->

参数

/content 目录中的页面在 Nuxt Content 中被定义为 page 类型。它们都遵循同样结构，并使用现有 frontmatter keys：