docs-components
Claude Code docs-components 技能:为 React 文档选择 MDX 提示组件
EnglishClaude Code 安装步骤
- 打开固定提交的 react.dev 工作副本,确认 `.claude/skills/docs-components/SKILL.md` 随仓库存在。
- 从仓库根目录启动 Claude Code,输入 `/docs-components` 并指定要更新的 MDX 文件和提示内容。
中文摘要
在 React 文档仓库写 MDX 时,按内容的用途选择 Note、Pitfall 或 DeepDive。技能也帮助核对标题级别、锚点和提示块里的空行,适合改写学习指南及 API 参考页。
SKILL.md 中文导读
可复现示例
为一篇虚构的状态教程写一条关于「事件处理函数里重复读取旧值」的常见错误提示。请用有标题的 `Pitfall`,并为「批量处理更新」的深入说明选一个合适的折叠组件。工作步骤
- 先标记需要提示、警示或展开解释的段落,再选择项目已有的组件。
- 检查组件起始标签后的空行和有标题提示块的标题级别。
- 在文档预览里打开目标页,验证提示块位置、标题和锚点。
验收方法
常见错误落在 `Pitfall`,带五级标题和可定位的 ID。深入说明进入 `DeepDive`,以带 ID 的四级标题开始。组件起始标签与正文之间留空行。
GitHub 原文 · 更新日期
适用环境
Claude Code 和 react.dev 文档仓库的固定版本。渲染核验使用该仓库的文档预览环境。
常见问题
React 文档里,术语解释和容易造成错误的写法应该用同一种提示组件吗?
术语解释可以用 `Note`。容易产生实际错误的写法使用 `Pitfall`,并写出读者能辨认的错误场景。