npx skills add https://github.com/vercel/next.js --skill update-docs指导您根据活动分支上的代码变更更新 Next.js 文档。专为维护者审查 PR 以确保文档完整性而设计。
git diff canary...HEAD --stat 查看哪些文件发生了更改pnpm lint 检查格式# 查看此分支上所有更改的文件
git diff canary...HEAD --stat
# 查看特定区域的更改
git diff canary...HEAD -- packages/next/src/
关注以下区域的更改:
| 源路径 | 可能的文档影响 |
|---|---|
packages/next/src/client/components/ |
广告位招租
在这里展示您的产品或服务
触达数万 AI 开发者,精准高效
| 组件 API 参考 |
packages/next/src/server/ | 函数 API 参考 |
packages/next/src/shared/lib/ | 根据导出内容而定 |
packages/next/src/build/ | 配置或构建文档 |
packages/next/src/lib/ | 各种功能 |
使用 references/CODE-TO-DOCS-MAPPING.md 中的代码到文档映射来查找对应的文档文件。
映射示例:
src/client/components/image.tsx → docs/01-app/03-api-reference/02-components/image.mdxsrc/server/config-shared.ts → docs/01-app/03-api-reference/05-config/在进行更改之前,请阅读现有文档以了解:
<AppOnly> / <PagesOnly> 来区分路由特定内容常见的更新包括:
对于每项更改:
如果文档使用了 source 字段模式(常见于 Pages Router 文档),则应编辑源文件。示例:
# 包含共享内容的 docs/02-pages/... 文件
---
source: app/building-your-application/optimizing/images
---
编辑 App Router 源文件,而不是 Pages Router 文件。
pnpm lint # 检查格式
pnpm prettier-fix # 自动修复格式问题
在添加全新功能的文档时使用此流程。
| 功能类型 | 文档位置 | 模板 |
|---|---|---|
| 新组件 | docs/01-app/03-api-reference/02-components/ | API 参考 |
| 新函数 | docs/01-app/03-api-reference/04-functions/ | API 参考 |
| 新配置选项 | docs/01-app/03-api-reference/05-config/ | 配置参考 |
| 新概念/指南 | docs/01-app/02-guides/ | 指南 |
| 新文件约定 | docs/01-app/03-api-reference/03-file-conventions/ | 文件约定 |
my-new-feature.mdx05-my-new-feature.mdxAPI 参考模板:
---
title: 功能名称
description: 此功能作用的简要描述。
---
{/* 此文档的内容在 App 和 Pages 路由器之间共享。您可以使用 `<PagesOnly>内容</PagesOnly>` 组件添加特定于 Pages 路由器的内容。任何共享内容不应包裹在组件中。 */}
功能的简要介绍。
## 参考
### 属性
<div style={{ overflowX: 'auto', width: '100%' }}>
| 属性 | 示例 | 类型 | 状态 |
| ----------------------- | ------------------ | ------ | -------- |
| [`propName`](#propname) | `propName="value"` | String | Required |
</div>
#### `propName`
属性的描述。
\`\`\`tsx filename="app/example.tsx" switcher
// TypeScript 示例
\`\`\`
\`\`\`jsx filename="app/example.js" switcher
// JavaScript 示例
\`\`\`
指南模板:
---
title: 如何在 Next.js 中实现 X
nav_title: X
description: 学习如何在您的 Next.js 应用程序中实现 X。
---
介绍,解释本指南为何有用。
## 先决条件
读者在开始前需要了解的内容。
## 步骤 1:第一步
解释和代码示例。
\`\`\`tsx filename="app/example.tsx" switcher
// 代码示例
\`\`\`
## 步骤 2:第二步
继续更多步骤...
## 后续步骤
可探索的相关主题。
在前置元数据中更新相关文档链接:
related:
title: 后续步骤
description: 了解更多相关功能。
links:
- app/api-reference/functions/related-function
- app/guides/related-guide
完整的格式规则请参见 references/DOC-CONVENTIONS.md。
前置元数据(必需):
---
title: 页面标题 (2-3 个词)
description: 描述页面的一两句话。
---
代码块:
\`\`\`tsx filename="app/page.tsx" switcher
// TypeScript 优先
\`\`\`
\`\`\`jsx filename="app/page.js" switcher
// JavaScript 其次
\`\`\`
路由器特定内容:
<AppOnly>仅适用于 App Router 文档的内容。</AppOnly>
<PagesOnly>仅适用于 Pages Router 文档的内容。</PagesOnly>
注释:
> **须知**:单行注释。
> **须知**:
>
> - 多行注释要点 1
> - 多行注释要点 2
在提交文档更改之前:
title 和 descriptionfilename 属性switcher 并附带 JS 变体pnpm lint 通过references/DOC-CONVENTIONS.md - 完整的前置元数据和格式规则references/CODE-TO-DOCS-MAPPING.md - 源代码到文档的映射每周安装量
1.4K
代码仓库
GitHub 星标
138.5K
首次出现
2026年1月22日
安全审计
安装于
opencode1.1K
gemini-cli1.1K
codex1.0K
claude-code998
github-copilot936
cursor931
Guides you through updating Next.js documentation based on code changes on the active branch. Designed for maintainers reviewing PRs for documentation completeness.
git diff canary...HEAD --stat to see what files changedpnpm lint to check formatting# See all changed files on this branch
git diff canary...HEAD --stat
# See changes in specific areas
git diff canary...HEAD -- packages/next/src/
Look for changes in these areas:
| Source Path | Likely Doc Impact |
|---|---|
packages/next/src/client/components/ | Component API reference |
packages/next/src/server/ | Function API reference |
packages/next/src/shared/lib/ | Varies by export |
packages/next/src/build/ | Configuration or build docs |
packages/next/src/lib/ | Various features |
Use the code-to-docs mapping in references/CODE-TO-DOCS-MAPPING.md to find corresponding documentation files.
Example mappings:
src/client/components/image.tsx → docs/01-app/03-api-reference/02-components/image.mdxsrc/server/config-shared.ts → docs/01-app/03-api-reference/05-config/Before making changes, read the existing doc to understand:
<AppOnly> / <PagesOnly> for router-specific contentCommon updates include:
For each change:
If the doc uses the source field pattern (common for Pages Router docs), the source file is the one to edit. Example:
# docs/02-pages/... file with shared content
---
source: app/building-your-application/optimizing/images
---
Edit the App Router source, not the Pages Router file.
pnpm lint # Check formatting
pnpm prettier-fix # Auto-fix formatting issues
Use this when adding documentation for entirely new features.
| Feature Type | Doc Location | Template |
|---|---|---|
| New component | docs/01-app/03-api-reference/02-components/ | API Reference |
| New function | docs/01-app/03-api-reference/04-functions/ | API Reference |
| New config option | docs/01-app/03-api-reference/05-config/ | Config Reference |
| New concept/guide | docs/01-app/02-guides/ | Guide |
| New file convention | docs/01-app/03-api-reference/03-file-conventions/ |
my-new-feature.mdx05-my-new-feature.mdxAPI Reference Template:
---
title: Feature Name
description: Brief description of what this feature does.
---
{/* The content of this doc is shared between the app and pages router. You can use the `<PagesOnly>Content</PagesOnly>` component to add content that is specific to the Pages Router. Any shared content should not be wrapped in a component. */}
Brief introduction to the feature.
## Reference
### Props
<div style={{ overflowX: 'auto', width: '100%' }}>
| Prop | Example | Type | Status |
| ----------------------- | ------------------ | ------ | -------- |
| [`propName`](#propname) | `propName="value"` | String | Required |
</div>
#### `propName`
Description of the prop.
\`\`\`tsx filename="app/example.tsx" switcher
// TypeScript example
\`\`\`
\`\`\`jsx filename="app/example.js" switcher
// JavaScript example
\`\`\`
Guide Template:
---
title: How to do X in Next.js
nav_title: X
description: Learn how to implement X in your Next.js application.
---
Introduction explaining why this guide is useful.
## Prerequisites
What the reader needs to know before starting.
## Step 1: First Step
Explanation and code example.
\`\`\`tsx filename="app/example.tsx" switcher
// Code example
\`\`\`
## Step 2: Second Step
Continue with more steps...
## Next Steps
Related topics to explore.
Update frontmatter with related documentation:
related:
title: Next Steps
description: Learn more about related features.
links:
- app/api-reference/functions/related-function
- app/guides/related-guide
See references/DOC-CONVENTIONS.md for complete formatting rules.
Frontmatter (required):
---
title: Page Title (2-3 words)
description: One or two sentences describing the page.
---
Code blocks:
\`\`\`tsx filename="app/page.tsx" switcher
// TypeScript first
\`\`\`
\`\`\`jsx filename="app/page.js" switcher
// JavaScript second
\`\`\`
Router-specific content:
<AppOnly>Content only for App Router docs.</AppOnly>
<PagesOnly>Content only for Pages Router docs.</PagesOnly>
Notes:
> **Good to know**: Single line note.
> **Good to know**:
>
> - Multi-line note point 1
> - Multi-line note point 2
Before committing documentation changes:
title and descriptionfilename attributeswitcher with JS variantpnpm lint passesreferences/DOC-CONVENTIONS.md - Complete frontmatter and formatting rulesreferences/CODE-TO-DOCS-MAPPING.md - Source code to documentation mappingWeekly Installs
1.4K
Repository
GitHub Stars
138.5K
First Seen
Jan 22, 2026
Security Audits
Gen Agent Trust HubPassSocketPassSnykPass
Installed on
opencode1.1K
gemini-cli1.1K
codex1.0K
claude-code998
github-copilot936
cursor931
React 组合模式指南:Vercel 组件架构最佳实践,提升代码可维护性
102,200 周安装
LibAFL模糊测试库:模块化、可定制的AFL++替代方案,支持高级模糊测试研究
1,100 周安装
Trail of Bits 测试手册技能生成器 - 自动化创建安全测试AI技能工具
1,100 周安装
Wycheproof 密码学测试工具:验证实现正确性,检测已知漏洞
1,100 周安装
网页内容提取器 - 智能URL转Markdown工具,支持JS渲染与反爬虫网站
1,100 周安装
React 19专家 | 服务器组件、性能优化与生产级架构实战指南
1,100 周安装
macOS应用公证完整指南:使用App Store Connect CLI进行开发者ID签名与公证
1,100 周安装
| File Convention |