create-docs：Nuxt Content/Docus 自动生成生产级文档站点工具

create-docs by nuxt-content/docus

271 周安装量

2,700 GitHub Stars

GitHub

安装命令

npx skills add https://github.com/nuxt-content/docus --skill create-docs

开发自动化技术文档

🇨🇳中文介绍

创建文档

为任何项目生成完整、可用于生产环境的文档站点。

工作流程

分析 - 检测包管理器、monorepo 结构，读取上下文
初始化 - 使用正确的设置创建 docs 目录
生成 - 使用模板编写文档页面
配置 - 设置 AI 集成（MCP, llms.txt）
收尾 - 提供包含正确命令的后续步骤

包管理器参考

根据锁文件检测，如果未找到则默认使用 npm：

锁文件	包管理器	安装	运行	添加
`pnpm-lock.yaml`	pnpm	`pnpm install`	`pnpm run`

广告位招租

在这里展示您的产品或服务

触达数万 AI 开发者，精准高效

联系我们

步骤 1：分析项目

Check for:
├── pnpm-workspace.yaml   → pnpm monorepo
├── turbo.json            → Turborepo monorepo
├── lerna.json            → Lerna monorepo
├── nx.json               → Nx monorepo
├── apps/                 → Apps 目录 (monorepo)
├── packages/             → Packages 目录 (monorepo)
├── docs/                 → 现有 docs 目录 (避免覆盖)
├── README.md             → 主要文档来源
└── src/ 或 lib/          → 源代码位置

项目类型	目标目录	工作空间入口
标准项目	`./docs`	N/A
带有 `apps/` 的 Monorepo	`./apps/docs`	`apps/docs`
带有 `packages/` 的 Monorepo	`./docs`	`docs`
已存在 `docs/` 文件夹	询问用户或使用 `./documentation`	—

读取上下文文件

文件	提取内容
`README.md`	项目名称、描述、功能、使用示例
`package.json`	名称、描述、依赖项、仓库 URL
`src/` 或 `lib/`	用于 API 文档的导出函数、组合式函数

检测国际化需求

检查项目是否需要多语言文档：

指标	操作
依赖项中包含 `@nuxtjs/i18n`	使用 i18n 模板
存在 `locales/` 或 `i18n/` 文件夹	使用 i18n 模板
存在多个语言的 README 文件	使用 i18n 模板
用户明确提及多种语言	使用 i18n 模板
以上均不符合	使用默认模板

步骤 2：初始化文档

[docs-location]/
├── app/                            # 可选：用于自定义
│   ├── app.config.ts
│   ├── components/
│   ├── layouts/
│   └── pages/
├── content/
│   ├── index.md
│   └── 1.getting-started/
│       ├── .navigation.yml
│       └── 1.introduction.md
├── public/
│   └── favicon.ico
├── package.json
└── .gitignore

i18n 模板（如果检测到多语言）：

[docs-location]/
├── app/
│   └── app.config.ts
├── content/
│   ├── en/
│   │   ├── index.md
│   │   └── 1.getting-started/
│   │       ├── .navigation.yml
│   │       └── 1.introduction.md
│   └── fr/                         # 或其他检测到的语言
│       ├── index.md
│       └── 1.getting-started/
│           ├── .navigation.yml
│           └── 1.introduction.md
├── nuxt.config.ts                  # i18n 配置必需
├── public/
│   └── favicon.ico
├── package.json
└── .gitignore

{
  "name": "[project-name]-docs",
  "private": true,
  "scripts": {
    "dev": "nuxt dev --extends docus",
    "build": "nuxt build --extends docus",
    "generate": "nuxt generate --extends docus",
    "preview": "nuxt preview --extends docus"
  },
  "dependencies": {
    "docus": "latest",
    "better-sqlite3": "^12.5.0",
    "nuxt": "^4.2.2"
  }
}

i18n（添加 @nuxtjs/i18n）：

{
  "name": "[project-name]-docs",
  "private": true,
  "scripts": {
    "dev": "nuxt dev --extends docus",
    "build": "nuxt build --extends docus",
    "generate": "nuxt generate --extends docus",
    "preview": "nuxt preview --extends docus"
  },
  "dependencies": {
    "@nuxtjs/i18n": "^10.2.1",
    "docus": "latest",
    "better-sqlite3": "^12.5.0",
    "nuxt": "^4.2.2"
  }
}

创建 nuxt.config.ts（仅 i18n 需要）

export default defineNuxtConfig({
  modules: ['@nuxtjs/i18n'],
  i18n: {
    locales: [
      { code: 'en', language: 'en-US', name: 'English' },
      { code: 'fr', language: 'fr-FR', name: 'Français' }
    ],
    defaultLocale: 'en'
  }
})

node_modules
.nuxt
.output
.data
dist

更新 Monorepo 配置（如果适用）

将 docs 添加到工作空间并配置 onlyBuiltDependencies（better-sqlite3 必需）：

  - 'apps/*'
  - 'docs'

onlyBuiltDependencies:
  - better-sqlite3

2. 在根 package.json 中添加开发脚本：

{
  "scripts": {
    "docs:dev": "pnpm run --filter [docs-package-name] dev"
  }
}

或者使用目录路径：

{
  "scripts": {
    "docs:dev": "cd docs && pnpm dev"
  }
}

{
  "workspaces": ["apps/*", "docs"],
  "scripts": {
    "docs:dev": "npm run dev --workspace=docs"
  }
}

步骤 3：生成文档

使用 references/templates.md 中的模板。

关键：MDC 组件命名

MDC 中的所有 Nuxt UI 组件必须使用 u- 前缀：

正确	错误
`::u-page-hero`	`::page-hero`
`::u-page-section`	`::page-section`
`:::u-page-feature`	`:::page-feature`
`:::u-button`	`:::button`
`::::u-page-card`	`::::page-card`

没有 u- 前缀，Vue 将无法解析这些组件。

content/
├── index.md                        # 首页
├── 1.getting-started/
│   ├── .navigation.yml
│   ├── 1.introduction.md
│   └── 2.installation.md
├── 2.guide/
│   ├── .navigation.yml
│   ├── 1.configuration.md
│   ├── 2.authentication.md
│   └── 3.deployment.md
└── 3.api/                          # 如果适用
    ├── .navigation.yml
    └── 1.reference.md

首页 (index.md) - 英雄区域 + 功能网格
介绍 - 是什么 & 为什么，使用场景
安装 - 先决条件，安装命令
指南页面 - 基于操作的 H2 标题的功能文档

关于写作风格，请参阅 references/writing-guide.md。关于 MDC 组件，请参阅 references/mdc-components.md。

步骤 4：配置 AI 集成

Docus 自动包含 MCP 服务器 (/mcp) 和 llms.txt 生成。无需配置。

请勿在首页添加 AI 集成部分。 这些功能会自动生效。

可选择在介绍页面提及：

::note
此文档包含 AI 集成，带有 MCP 服务器和自动 `llms.txt` 生成。
::

可选：app.config.ts

export default defineAppConfig({
  docus: {
    name: '[项目名称]',
    description: '[项目描述]',
    url: 'https://[docs-url]',
    socials: {
      github: '[组织]/[仓库]'
    }
  }
})

可选：主题自定义

如果项目有设计系统或品牌颜色，可以自定义文档主题。

创建 app/assets/css/main.css：

@import "tailwindcss";
@import "@nuxt/ui";

@theme {
  /* 自定义字体 */
  --font-sans: 'Inter', sans-serif;

  /* 自定义容器宽度 */
  --ui-container: 90rem;

  /* 自定义主色调（使用项目品牌颜色） */
  --color-primary-50: oklch(0.97 0.02 250);
  --color-primary-500: oklch(0.55 0.2 250);
  --color-primary-900: oklch(0.25 0.1 250);
}

扩展的 app.config.ts

export default defineAppConfig({
  docus: {
    name: '[项目名称]',
    description: '[项目描述]',
    url: 'https://[docs-url]',
    socials: {
      github: '[组织]/[仓库]',
      x: '@[句柄]'
    }
  },
  // 自定义 UI 组件
  ui: {
    colors: {
      primary: 'emerald',
      neutral: 'zinc',
    },
    pageHero: {
      slots: {
        title: 'font-semibold sm:text-6xl'
      }
    }
  }
})

使用检测到的包管理器提供说明。

文档已创建于 [docs-location]

启动方法：

  cd [docs-location]
  [pm] install
  [pm] run dev

访问地址：http://localhost:3000

文档已创建于 [docs-location]

从根目录启动：

  [pm] install
  [pm] run docs:dev

或从 docs 目录启动：

  cd [docs-location]
  [pm] run dev

访问地址：http://localhost:3000

全文搜索
深色模式
用于 AI 工具的 MCP 服务器 (/mcp)
LLM 集成 (/llms.txt)
SEO 优化

检查生成的内容
在 content/2.guide/ 中添加更多指南
在 app.config.ts 中自定义主题
部署到 Vercel/Netlify/Cloudflare

文档创建完成后，建议进行增强：

您的文档已准备就绪！

您希望我：
- **自定义 UI** - 匹配您的品牌颜色和样式
- **增强首页** - 添加功能卡片、代码预览、视觉效果
- **添加 i18n 支持** - 多语言文档
- **设置部署** - 部署到 Vercel、Netlify 或 Cloudflare

请告诉我您想改进什么！

平台	命令	输出
Vercel	`npx vercel --prod`	自动检测
Netlify	`[pm] run generate`	`.output/public`
Cloudflare Pages	`[pm] run generate`	`.output/public`
GitHub Pages	`[pm] run generate`	`.output/public`

检测到： pnpm monorepo，包在 packages/ 中

生成的结构：

docs/
├── content/
│   ├── index.md
│   ├── 1.getting-started/
│   │   ├── .navigation.yml
│   │   ├── 1.introduction.md
│   │   └── 2.installation.md
│   ├── 2.guide/
│   │   ├── .navigation.yml
│   │   ├── 1.authentication.md
│   │   ├── 2.oauth-providers.md
│   │   └── 3.sessions.md
│   └── 3.api/
│       ├── .navigation.yml
│       └── 1.composables.md
├── public/
│   └── favicon.ico
├── package.json
└── .gitignore

authentication.md 内部（基于操作的 H2 标题）：

## 添加基本身份验证
## 保护您的路由
## 处理登录重定向
## 自定义会话

🇺🇸English

Create Docs

Generate a complete, production-ready documentation site for any project.

Workflow

Analyze - Detect package manager, monorepo structure, read context
Initialize - Create docs directory with correct setup
Generate - Write documentation pages using templates
Configure - Set up AI integration (MCP, llms.txt)
Finalize - Provide next steps with correct commands

Package Manager Reference

Detect from lock files, default to npm if none found:

Lock File	PM	Install	Run	Add
`pnpm-lock.yaml`	pnpm	`pnpm install`	`pnpm run`	`pnpm add`
`package-lock.json`	npm	`npm install`	`npm run`	`npm install`
`yarn.lock`	yarn	`yarn install`	`yarn`	`yarn add`
`bun.lockb`	bun	`bun install`	`bun run`	`bun add`

Use [pm] as placeholder in commands below.

Step 1: Analyze Project

Detect Project Structure

Check for:
├── pnpm-workspace.yaml   → pnpm monorepo
├── turbo.json            → Turborepo monorepo
├── lerna.json            → Lerna monorepo
├── nx.json               → Nx monorepo
├── apps/                 → Apps directory (monorepo)
├── packages/             → Packages directory (monorepo)
├── docs/                 → Existing docs (avoid overwriting)
├── README.md             → Main documentation source
└── src/ or lib/          → Source code location

Determine Docs Location

Project Type	Target Directory	Workspace Entry
Standard project	`./docs`	N/A
Monorepo with `apps/`	`./apps/docs`	`apps/docs`
Monorepo with `packages/`	`./docs`	`docs`

Read Context Files

File	Extract
`README.md`	Project name, description, features, usage examples
`package.json`	Name, description, dependencies, repository URL
`src/` or `lib/`	Exported functions, composables for API docs

Detect i18n Requirement

Check if project needs multi-language docs:

Indicator	Action
`@nuxtjs/i18n` in dependencies	Use i18n template
`locales/` or `i18n/` folder exists	Use i18n template
Multiple language README files	Use i18n template
User explicitly mentions multiple languages	Use i18n template
None of the above	Use default template

Step 2: Initialize Docs

Create Directory Structure

Default template:

[docs-location]/
├── app/                            # Optional: for customization
│   ├── app.config.ts
│   ├── components/
│   ├── layouts/
│   └── pages/
├── content/
│   ├── index.md
│   └── 1.getting-started/
│       ├── .navigation.yml
│       └── 1.introduction.md
├── public/
│   └── favicon.ico
├── package.json
└── .gitignore

i18n template (if multi-language detected):

[docs-location]/
├── app/
│   └── app.config.ts
├── content/
│   ├── en/
│   │   ├── index.md
│   │   └── 1.getting-started/
│   │       ├── .navigation.yml
│   │       └── 1.introduction.md
│   └── fr/                         # Or other detected languages
│       ├── index.md
│       └── 1.getting-started/
│           ├── .navigation.yml
│           └── 1.introduction.md
├── nuxt.config.ts                  # Required for i18n config
├── public/
│   └── favicon.ico
├── package.json
└── .gitignore

Create package.json

Default:

{
  "name": "[project-name]-docs",
  "private": true,
  "scripts": {
    "dev": "nuxt dev --extends docus",
    "build": "nuxt build --extends docus",
    "generate": "nuxt generate --extends docus",
    "preview": "nuxt preview --extends docus"
  },
  "dependencies": {
    "docus": "latest",
    "better-sqlite3": "^12.5.0",
    "nuxt": "^4.2.2"
  }
}

i18n (add @nuxtjs/i18n):

{
  "name": "[project-name]-docs",
  "private": true,
  "scripts": {
    "dev": "nuxt dev --extends docus",
    "build": "nuxt build --extends docus",
    "generate": "nuxt generate --extends docus",
    "preview": "nuxt preview --extends docus"
  },
  "dependencies": {
    "@nuxtjs/i18n": "^10.2.1",
    "docus": "latest",
    "better-sqlite3": "^12.5.0",
    "nuxt": "^4.2.2"
  }
}

Create nuxt.config.ts (i18n only)

export default defineNuxtConfig({
  modules: ['@nuxtjs/i18n'],
  i18n: {
    locales: [
      { code: 'en', language: 'en-US', name: 'English' },
      { code: 'fr', language: 'fr-FR', name: 'Français' }
    ],
    defaultLocale: 'en'
  }
})

Create .gitignore

node_modules
.nuxt
.output
.data
dist

Update Monorepo Configuration (if applicable)

pnpm Monorepo

Add docs to workspace and configure onlyBuiltDependencies (required for better-sqlite3):

packages:

  - 'apps/*'
  - 'docs'

onlyBuiltDependencies:
  - better-sqlite3

2. Add dev script to root package.json:

{
  "scripts": {
    "docs:dev": "pnpm run --filter [docs-package-name] dev"
  }
}

Or with directory path:

{
  "scripts": {
    "docs:dev": "cd docs && pnpm dev"
  }
}

npm/yarn Monorepo

{
  "workspaces": ["apps/*", "docs"],
  "scripts": {
    "docs:dev": "npm run dev --workspace=docs"
  }
}

Step 3: Generate Documentation

Use templates from references/templates.md.

CRITICAL: MDC Component Naming

All Nuxt UI components in MDC must use the u- prefix:

Correct	Wrong
`::u-page-hero`	`::page-hero`
`::u-page-section`	`::page-section`
`:::u-page-feature`	`:::page-feature`
`:::u-button`	`:::button`

Without the u- prefix, Vue will fail to resolve the components.

Documentation Structure

content/
├── index.md                        # Landing page
├── 1.getting-started/
│   ├── .navigation.yml
│   ├── 1.introduction.md
│   └── 2.installation.md
├── 2.guide/
│   ├── .navigation.yml
│   ├── 1.configuration.md
│   ├── 2.authentication.md
│   └── 3.deployment.md
└── 3.api/                          # If applicable
    ├── .navigation.yml
    └── 1.reference.md

Generate Pages

Landing page (index.md) - Hero + features grid
Introduction - What & why, use cases
Installation - Prerequisites, install commands
Guide pages - Feature documentation with action-based H2 headings

For writing style, see references/writing-guide.md. For MDC components, see references/mdc-components.md.

Step 4: Configure AI Integration

Docus automatically includes MCP server (/mcp) and llms.txt generation. No configuration needed.

Do NOT add AI Integration sections to the landing page. These features work automatically.

Optionally mention in the introduction page:

::note
This documentation includes AI integration with MCP server and automatic `llms.txt` generation.
::

Optional: app.config.ts

export default defineAppConfig({
  docus: {
    name: '[Project Name]',
    description: '[Project description]',
    url: 'https://[docs-url]',
    socials: {
      github: '[org]/[repo]'
    }
  }
})

Optional: Theme Customization

If the project has a design system or brand colors, customize the docs theme.

Custom CSS

Create app/assets/css/main.css:

@import "tailwindcss";
@import "@nuxt/ui";

@theme {
  /* Custom font */
  --font-sans: 'Inter', sans-serif;

  /* Custom container width */
  --ui-container: 90rem;

  /* Custom primary color (use project brand color) */
  --color-primary-50: oklch(0.97 0.02 250);
  --color-primary-500: oklch(0.55 0.2 250);
  --color-primary-900: oklch(0.25 0.1 250);
}

Extended app.config.ts

export default defineAppConfig({
  docus: {
    name: '[Project Name]',
    description: '[Project description]',
    url: 'https://[docs-url]',
    socials: {
      github: '[org]/[repo]',
      x: '@[handle]'
    }
  },
  // Customize UI components
  ui: {
    colors: {
      primary: 'emerald',
      neutral: 'zinc',
    },
    pageHero: {
      slots: {
        title: 'font-semibold sm:text-6xl'
      }
    }
  }
})

Step 5: Finalize

Provide instructions using detected package manager.

Standard Project

Documentation created in [docs-location]

To start:

  cd [docs-location]
  [pm] install
  [pm] run dev

Available at http://localhost:3000

Monorepo

Documentation created in [docs-location]

To start from root:

  [pm] install
  [pm] run docs:dev

Or from docs directory:

  cd [docs-location]
  [pm] run dev

Available at http://localhost:3000

Features Included

Full-text search
Dark mode
MCP server for AI tools (/mcp)
LLM integration (/llms.txt)
SEO optimized

Next Steps

Review generated content
Add more guides in content/2.guide/
Customize theme in app.config.ts
Deploy to Vercel/Netlify/Cloudflare

Suggest Follow-ups

After documentation is created, suggest enhancements:

Your documentation is ready!

Would you like me to:
- **Customize the UI** - Match your brand colors and style
- **Enhance the landing page** - Add feature cards, code previews, visuals
- **Add i18n support** - Multi-language documentation
- **Set up deployment** - Deploy to Vercel, Netlify, or Cloudflare

Let me know what you'd like to improve!

Deployment

Platform	Command	Output
Vercel	`npx vercel --prod`	Auto-detected
Netlify	`[pm] run generate`	`.output/public`
Cloudflare Pages	`[pm] run generate`	`.output/public`
GitHub Pages	`[pm] run generate`

Example: auth-utils

Detected: pnpm monorepo, package in packages/

Generated structure:

docs/
├── content/
│   ├── index.md
│   ├── 1.getting-started/
│   │   ├── .navigation.yml
│   │   ├── 1.introduction.md
│   │   └── 2.installation.md
│   ├── 2.guide/
│   │   ├── .navigation.yml
│   │   ├── 1.authentication.md
│   │   ├── 2.oauth-providers.md
│   │   └── 3.sessions.md
│   └── 3.api/
│       ├── .navigation.yml
│       └── 1.composables.md
├── public/
│   └── favicon.ico
├── package.json
└── .gitignore

Insideauthentication.md (action-based H2 headings):

## Add basic authentication
## Protect your routes
## Handle login redirects
## Customize the session

Weekly Installs

271

Repository

nuxt-content/docus

GitHub Stars

2.7K

First Seen

Jan 27, 2026

Security Audits

Gen Agent Trust HubPass SocketPass SnykPass

Installed on

opencode230

github-copilot228

gemini-cli224

codex223

amp195

kimi-cli195

agent-browser 浏览器自动化工具 - Vercel Labs 命令行网页操作与测试

140,500 周安装

create-docs：Nuxt Content/Docus 自动生成生产级文档站点工具

🇨🇳中文介绍

创建文档

工作流程

包管理器参考

相关 Skills

步骤 1：分析项目

检测项目结构

确定文档位置

读取上下文文件

检测国际化需求

步骤 2：初始化文档

创建目录结构

创建 package.json

创建 nuxt.config.ts（仅 i18n 需要）

创建 .gitignore

更新 Monorepo 配置（如果适用）

pnpm Monorepo

npm/yarn Monorepo

步骤 3：生成文档

文档结构

生成页面

步骤 4：配置 AI 集成

可选：app.config.ts

可选：主题自定义

自定义 CSS

扩展的 app.config.ts

步骤 5：收尾

标准项目

Monorepo

包含的功能

后续步骤

建议后续操作

部署

示例：auth-utils

🇺🇸English

Create Docs

Workflow

Package Manager Reference

Step 1: Analyze Project

Detect Project Structure

Determine Docs Location

Read Context Files

Detect i18n Requirement

Step 2: Initialize Docs

Create Directory Structure

Create package.json

Create nuxt.config.ts (i18n only)

Create .gitignore

Update Monorepo Configuration (if applicable)

pnpm Monorepo

npm/yarn Monorepo

Step 3: Generate Documentation

Documentation Structure

Generate Pages

Step 4: Configure AI Integration

Optional: app.config.ts

Optional: Theme Customization

Custom CSS

Extended app.config.ts

Step 5: Finalize

Standard Project

Monorepo

Features Included

Next Steps

Suggest Follow-ups

Deployment

Example: auth-utils

最新 Skills