Skip to content

Claude Code 实战指南 ​

场景驱动 | 快速上手 | 开箱即用


文档定位 ​

本文档是 场景驱动的实战指南,与其他文档的关系:

  • ClaudeCode.md: 模板库,提供 34 个通用提示词模板
  • 实战指南.md (本文档): 场景手册,提供具体场景的完整解决方案
  • 关系: 模板库提供原子能力,实战指南组合模板解决实际问题

何时使用本文档:

  • 为 VitePress 文档站点添加新内容
  • 执行多步骤的文档处理流程
  • 需要完整工作流程指导的场景

何时使用 ClaudeCode.md:

  • 单次操作 (查询代码、改变量名等)
  • 需要查找特定语法模板
  • 需要了解工具基础用法

快速开始 ​

5 分钟上手 ​

场景导航 ​

根据你的需求,选择对应场景:

bash
┌─────────────────────────────────────────┐
│ 文档项目专属场景                          │
├─────────────────────────────────────────┤
│ 📝 添加新的函数文档                       │
│    → 场景 1: 单个函数文档添加              │
│                                         │
│ 📚 批量生成文档                           │
│    → 场景 2: 批量函数文档生成              │
│                                         │
│ 🔧 优化现有文档格式                       │
│    → 场景 3: 文档格式标准化                │
│                                         │
│ 🗂️ 配置导航和侧边栏                       │
│    → 场景 4: 导航配置优化                  │
│                                         │
│ 🎨 自定义主题和组件                       │
│    → 场景 5: 主题定制                     │
│                                         │
│ 🐛 修复构建错误                           │
│    → 工作流 3: Bug 修复流程                │
│                                         │
│ ⚡ 性能优化                               │
│    → 工作流 6: 性能优化流程                │
└─────────────────────────────────────────┘

第一部分: 文档项目专属场景 ​

场景 1: 添加单个函数文档 ​

需求: 为 PostgreSQL 或其他数据库添加一个函数的文档页面

复杂度: 🟢 简单 (2-3 轮)

完整流程:

第 1 轮: 确认文档格式 ​

bash
我需要为 PostgreSQL 函数 [函数名] 添加文档页面

请先查看现有函数文档格式:
@docs/database/postgreSQL/ref/ascii.md

分析并复述文档格式规范,包括:
1. frontmatter 结构
2. 标题层级
3. 内容组织方式
4. 示例格式

不要写代码

AI 会输出: 文档格式规范的详细说明


第 2 轮: 提供函数信息并生成 ​

bash
理解正确,现在根据以下信息生成文档

【函数信息】
- 函数名: [函数名]
- 功能描述: [描述]
- 语法: [语法]
- 参数说明: [参数]
- 返回值: [返回值类型和说明]
- 示例:
  ```sql
  [SQL 示例]

【文档路径】 创建文件: docs/database/postgreSQL/ref/[函数名].md

【要求】

  • 严格遵循 @docs/database/postgreSQL/ref/ascii.md 的格式
  • 使用中文撰写
  • 示例要实用且易懂

开始生成

bash

---

#### 第 3 轮: 更新侧边栏配置

```bash
文档生成完成,现在更新侧边栏配置

@docs/.vitepress/sidebar.ts

在 PostgreSQL 函数参考部分添加新文档的链接

要求:
- 按字母顺序或分类插入
- 保持现有格式
- 检查是否有重复项

直接修改

总结: 3 轮完成单个函数文档添加,包含生成文档和配置更新


场景 2: 批量生成函数文档 ​

需求: 一次性为多个函数生成文档

复杂度: 🟡 中等 (4-6 轮)

完整流程:

第 1 轮: 准备函数清单 ​

bash
我需要批量生成 PostgreSQL 函数文档

请先读取现有文档格式:
@docs/database/postgreSQL/ref/ascii.md

然后制定批量生成方案,不要写代码

【函数清单】
准备以 CSV 或 JSON 格式提供函数信息,包含:
- 函数名
- 功能描述
- 语法
- 示例

请建议最佳的数据组织格式

第 2 轮: 提供数据并开始生成 ​

bash
采用建议的格式,这是函数数据:

[粘贴 JSON 或 CSV 数据]

要求:
- 为每个函数生成独立的 .md 文件
- 文件命名: 函数名小写.md
- 保存路径: docs/database/postgreSQL/ref/
- 每生成 5 个暂停一次,让我确认

开始第一批 (1-5)

第 3-5 轮: 分批生成 ​

bash
第一批正确,继续第二批 (6-10)

(重复直到完成所有函数)


第 6 轮: 批量更新侧边栏 ​

bash
所有文档生成完成

现在更新 @docs/.vitepress/sidebar.ts

批量添加以下函数文档链接:
[函数名列表]

要求:
- 按分类或字母顺序插入
- 保持一致的缩进和格式

直接修改

总结: 通过分批生成和统一配置更新,高效完成批量文档创建


场景 3: 文档格式标准化 ​

需求: 将不规范的文档统一为标准格式

复杂度: 🟡 中等 (4-5 轮)

完整流程:

第 1 轮: 分析现有文档 ​

bash
@docs/database/postgreSQL/ref/ascii.md 是标准格式
@docs/[待优化文档路径]

请对比这两个文档,列出不符合标准的地方,不要写代码

【对比维度】
1. frontmatter 是否完整
2. 标题层级是否正确
3. 代码块是否有语言标识
4. 示例格式是否统一
5. 空行和缩进是否规范

第 2 轮: 制定优化方案 ​

bash
理解问题,请给出详细的优化方案,不要写代码

包括:
1. 需要修改的具体位置
2. 修改前后对比
3. 是否需要补充内容

第 3 轮: 执行优化 ​

bash
采用方案,开始优化

@docs/[待优化文档路径]

要求:
- 严格遵循标准格式
- 保留原有内容,仅调整格式
- 补充缺失的 frontmatter

直接修改

第 4 轮: 批量优化 (如需要) ​

bash
第一个文档优化完成

现在按相同标准优化以下文档:
@docs/[文档 1]
@docs/[文档 2]
@docs/[文档 3]

每个文档优化完成后暂停

总结: 通过标准对比和逐步优化,确保文档格式一致性


场景 4: 导航和侧边栏配置优化 ​

需求: 重新组织导航结构或侧边栏分类

复杂度: 🟡 中等 (3-4 轮)

完整流程:

第 1 轮: 分析现有结构 ​

bash
@docs/.vitepress/nav.ts
@docs/.vitepress/sidebar.ts

分析当前导航和侧边栏结构,不要写代码

【分析内容】
1. 当前的分类逻辑
2. 各分类下的内容数量
3. 是否有分类不合理的地方
4. 是否有遗漏的文档

请给出结构优化建议

第 2 轮: 设计新结构 ​

bash
采用建议 [X],请详细设计新的导航结构,不要写代码

包括:
1. 顶层导航分类
2. 每个分类下的子项
3. 侧边栏的嵌套层级
4. 迁移影响评估

第 3 轮: 实施配置更新 ​

bash
确认方案,开始更新配置

先更新 @docs/.vitepress/nav.ts
按照新设计调整导航结构

完成后暂停

第 4 轮: 更新侧边栏 ​

bash
导航更新正确

现在更新 @docs/.vitepress/sidebar.ts
按照新分类组织侧边栏

要求:
- 保持路径正确
- 保持层级清晰
- 添加必要的注释

直接修改

总结: 通过分析-设计-实施的流程,系统性优化导航结构


场景 5: VitePress 主题定制 ​

需求: 自定义主题样式或组件

复杂度: 🔴 复杂 (6-8 轮)

完整流程:

第 1 轮: 理解现有主题 ​

bash
@docs/.vitepress/theme/index.ts
@docs/.vitepress/theme/style.css

分析当前主题配置,不要写代码

【分析内容】
1. 使用的基础主题
2. 已注册的自定义组件
3. 已应用的插件
4. 自定义样式范围

第 2 轮: 需求讨论 ​

bash
我需要实现以下定制,请讨论实施方案,不要写代码

【定制需求】
[具体描述,例如:]
- 添加自定义页面布局
- 修改主题色
- 添加全局组件
- 集成第三方插件

【技术约束】
- 不破坏现有功能
- 保持 VitePress 升级兼容性
- 性能影响最小化

请给出 2-3 个方案对比

第 3 轮: 方案确认 ​

bash
采用方案 [X],请详细说明实施步骤,不要写代码

包括:
1. 需要创建的文件
2. 需要修改的配置
3. 依赖安装 (如有)
4. 实施顺序

第 4-7 轮: 分步实施 ​

bash
# 第 4 轮
开始第一步: [步骤描述]
完成后暂停

# 第 5 轮
第一步正确,继续第二步
...

# (根据复杂度调整轮数)

第 8 轮: 测试验证 ​

bash
所有步骤完成

请列出测试要点:
1. 需要检查的页面
2. 需要测试的功能
3. 浏览器兼容性检查
4. 性能影响评估

输出测试清单,不要写代码

总结: 复杂定制需要充分的方案讨论和分步实施


第二部分: 通用工作流程 ​

工作流 1: 新功能开发 ​

适用场景: 从 0 到 1 开发新的文档模块或功能

预计轮数: 8-10 轮

流程图:

bash
需求分析(1) → 方案设计(2-3) → 需求确认(4)
→ 任务规划(5) → 分步实施(6-8) → 验证测试(9) → 文档更新(10)

阶段 1: 需求分析 (第 1 轮) ​

bash
/clear

讨论需求,不要写代码

【需求背景】
[业务背景描述]

【功能目标】
[要实现的核心功能]

【技术要求】
- [技术约束 1]
- [技术约束 2]

【相关文件】
@[相关配置文件 1]
@[相关配置文件 2]

请分析:
1. 现有架构是否支持该需求
2. 需要新增哪些文件/配置
3. 可能的技术难点
4. 是否有类似功能可参考

阶段 2: 方案设计 (第 2-3 轮) ​

第 2 轮: 方案对比 ​
bash
基于以上分析,请提供 2-3 个设计方案,不要写代码

对比维度:
- 实施复杂度
- 维护成本
- 扩展性
- 对现有系统的影响
第 3 轮: 详细设计 ​
bash
采用方案 [X],请详细说明实施步骤,不要写代码

包括:
1. 文件和目录结构
2. 配置变更
3. 依赖安装
4. 关键实现细节
5. 潜在风险点

阶段 3: 需求确认 (第 4 轮) ​

bash
请复述以下内容,确认理解一致,不要写代码:

1. 文件和目录设计
2. 配置项说明
3. 核心功能流程
4. 边界条件处理
5. 兼容性策略

阶段 4: 任务规划 (第 5 轮) ​

bash
制定详细的 todo 清单,按优先级排序,不要写代码

要求:
- 每个 todo 是独立可测试的最小单元
- 标注依赖关系
- 标注风险点
- 预估每个步骤的工作量

阶段 5: 分步实施 (第 6-8 轮) ​

bash
# 第 6 轮
采用方案 [X],开始编码

【实施顺序】
1. 先创建基础文件和目录
2. 再配置必要的设置
3. 最后实现核心功能

每完成一步暂停,等我确认后继续

# 第 7-8 轮
ok,继续下一步

阶段 6: 验证测试 (第 9 轮) ​

bash
功能实施完成,请列出测试要点:

【功能测试】
- [测试点 1]
- [测试点 2]

【边界测试】
- [边界情况 1]
- [边界情况 2]

【兼容性测试】
- 浏览器兼容性
- 旧版本数据兼容性

输出测试清单,不要写代码

阶段 7: 文档更新 (第 10 轮) ​

bash
测试通过,请更新相关文档:

1. 更新 README.md (如有新的依赖或配置)
2. 更新 CLAUDE.md (如有新的规范)
3. 生成使用说明 (如需要)

直接修改

工作流 2: 代码重构 ​

适用场景: 改造现有文档或配置,提升质量

预计轮数: 5-8 轮

流程图:

bash
现状分析(1) → 参考学习(2) → 重构方案(3) → 分步实施(4-7) → 验证(8)

第 1 轮: 现状分析 ​

bash
@[待重构文件]

分析当前代码/配置的问题,不要写代码

【分析维度】
1. 结构是否清晰
2. 是否有重复代码
3. 是否符合最佳实践
4. 可维护性评估
5. 性能问题 (如适用)

第 2 轮: 参考学习 ​

bash
@[参考文件]

学习参考文件的优秀实践

请提取:
1. 代码组织方式
2. 命名规范
3. 注释风格
4. 可复用的模式

整理后说明如何应用到重构中,不要写代码

第 3 轮: 重构方案 ​

bash
基于分析和参考,制定重构方案,不要写代码

【重构内容】
1. 结构调整
2. 代码提取和复用
3. 命名优化
4. 注释补充

【约束条件】
- 不改变功能行为
- 保持向后兼容
- 分步实施,每步可验证

请给出详细的分步方案

第 4-7 轮: 逐步实施 ​

bash
# 第 4 轮
采用方案,开始重构

先进行第一步: [步骤描述]
完成后暂停

# 第 5-7 轮
第一步正确,继续第二步
...

第 8 轮: 验证 ​

bash
重构完成,请验证:

1. 功能是否正常
2. 是否引入新问题
3. 是否达到重构目标

输出验证清单,不要写代码

工作流 3: Bug 修复 ​

适用场景: 快速定位和修复问题

预计轮数: 5 轮

流程图:

问题复现(1) → 根因分析(2) → 修复方案(3) → 实施修复(4) → 验证(5)

第 1 轮: 问题复现 ​

bash
遇到以下问题,请帮助定位

【问题描述】
[详细描述现象]

【复现步骤】
1. [步骤 1]
2. [步骤 2]

【预期行为】
[应该是什么]

【实际行为】
[实际是什么]

【相关文件】
@[可能相关的文件 1]
@[可能相关的文件 2]

请先理解问题,不要写代码

第 2 轮: 根因分析 ​

bash
基于代码分析根本原因,不要写代码

【分析内容】
1. 问题出现的具体位置
2. 为什么会出现这个问题
3. 是否有其他潜在影响
4. 是否是设计缺陷

第 3 轮: 修复方案 ​

bash
请给出修复方案,不要写代码

【方案要求】
1. 最小化改动
2. 不引入新问题
3. 考虑边界情况
4. 是否需要补充测试

如有多个方案,请对比说明

第 4 轮: 实施修复 ​

bash
采用方案 [X],开始修复

@[文件路径]#[行号]

[具体修复指令]

直接修改

第 5 轮: 验证测试 ​

bash
修复完成,请列出验证要点:

【功能验证】
- 原问题是否解决
- 复现步骤是否正常

【回归验证】
- 相关功能是否受影响
- 边界情况是否正常

【建议测试用例】
[补充测试用例建议]

输出验证清单,不要写代码

工作流 4: 文档站点配置变更 ​

适用场景: 修改 VitePress 配置、插件、主题等

预计轮数: 4 轮

流程图:

需求分析(1) → 配置方案(2) → 实施变更(3) → 测试验证(4)

第 1 轮: 需求分析 ​

bash
需要对文档站点进行配置变更

【变更需求】
[描述需要修改的配置]

【当前配置】
@docs/.vitepress/config.ts

请分析:
1. 需要修改哪些配置项
2. 是否需要安装新依赖
3. 变更的影响范围
4. 是否有风险

不要写代码

第 2 轮: 配置方案 ​

bash
基于分析,请给出配置方案,不要写代码

【方案内容】
1. 具体的配置修改
2. 依赖安装命令 (如需要)
3. 配置项说明
4. 注意事项

第 3 轮: 实施变更 ​

bash
采用方案,开始配置变更

先安装依赖 (如需要)
然后修改配置文件

@docs/.vitepress/config.ts

[具体配置修改指令]

直接修改

第 4 轮: 测试验证 ​

bash
配置变更完成

请列出验证步骤:
1. 开发服务器启动测试
2. 构建测试
3. 功能验证要点
4. 性能影响检查

输出测试清单,不要写代码

工作流 5: 内容迁移 ​

适用场景: 从其他文档系统迁移到 VitePress

预计轮数: 6-8 轮

流程图:

源分析(1) → 迁移方案(2) → 格式转换(3-5) → 配置更新(6) → 验证(7-8)

第 1 轮: 源分析 ​

bash
需要将文档从 [源系统] 迁移到 VitePress

【源文档信息】
- 文档数量: [数量]
- 文档格式: [Markdown/其他]
- 目录结构: [描述]
- 特殊语法: [如有]

【示例文档】
[粘贴或引用示例]

请分析:
1. 源格式与 VitePress 的差异
2. 需要转换的内容类型
3. 迁移难点
4. 建议的迁移策略

不要写代码

第 2 轮: 迁移方案 ​

bash
基于分析,制定迁移方案,不要写代码

【方案内容】
1. 目录结构映射
2. 格式转换规则
3. 特殊语法处理
4. 配置生成策略
5. 分批迁移计划

请详细说明每个环节

第 3-5 轮: 格式转换 ​

bash
# 第 3 轮
采用方案,开始迁移

第一批: [文档范围]

要求:
- 转换为 VitePress Markdown 格式
- 添加必要的 frontmatter
- 保持目录结构
- 每批完成后暂停

开始第一批

# 第 4-5 轮
第一批正确,继续第二批
...

第 6 轮: 配置更新 ​

bash
所有文档迁移完成

现在更新导航和侧边栏配置:
@docs/.vitepress/nav.ts
@docs/.vitepress/sidebar.ts

根据迁移后的目录结构生成配置

直接修改

第 7-8 轮: 验证 ​

bash
# 第 7 轮
配置更新完成

请列出验证要点:
1. 所有页面是否可访问
2. 导航和侧边栏是否正确
3. 链接是否有效
4. 格式是否正常

输出验证清单,不要写代码

# 第 8 轮
测试发现以下问题:
[问题描述]

请修复

工作流 6: 性能优化 ​

适用场景: 优化文档站点的构建和访问性能

预计轮数: 4 轮

流程图:

bash
性能分析(1) → 优化方案(2) → 实施优化(3) → 效果验证(4)

第 1 轮: 性能分析 ​

bash
文档站点存在性能问题

【问题描述】
[构建慢/加载慢/其他]

【当前配置】
@docs/.vitepress/config.ts
@package.json

请分析可能的性能瓶颈:
1. 构建配置
2. 文档数量和大小
3. 插件和依赖
4. 资源加载

不要写代码

第 2 轮: 优化方案 ​

bash
基于分析,制定优化方案,不要写代码

【优化内容】
1. 配置优化
2. 依赖优化
3. 资源优化
4. 构建优化

【预期效果】
[具体的性能提升目标]

请详细说明每项优化的方法

第 3 轮: 实施优化 ​

bash
采用方案,开始优化

按以下顺序实施:
1. [优化项 1]
2. [优化项 2]
3. [优化项 3]

每完成一项暂停,验证效果后继续

第 4 轮: 效果验证 ​

bash
所有优化完成

请列出性能对比测试方法:
1. 构建时间对比
2. 页面加载速度对比
3. 资源大小对比
4. 其他性能指标

输出测试指南,不要写代码

第三部分: 最佳实践 ​

1. 上下文管理 ​

何时清空上下文 ​

应该清空的场景:

  • 切换到完全不同的任务
  • 对话超过 50 轮
  • AI 开始混淆上下文

不应该清空的场景:

  • 任务进行中
  • 仅切换文件
  • 对结果不满意 (应纠正而非清空)

清空后快速恢复 ​

bash
/clear

继续 [任务名称]

【上次进度】
- 已完成: [步骤 1], [步骤 2]
- 当前: [当前步骤]
- 关键决策: [重要决策]

请先复述关键决策,然后继续

2. 多文件协作 ​

精确引用 ​

bash
@docs/.vitepress/config.ts
@docs/.vitepress/sidebar.ts

分析配置文件的关联关系,不要写代码

注意:

  • 一次不超过 5 个文件
  • 大文件加行号限制
  • 路径必须准确

3. 文档格式规范 ​

统一格式检查清单 ​

bash
- [ ] frontmatter 完整 (layout, title 等)
- [ ] 标题层级正确 (h1 唯一, h2-h4 嵌套)
- [ ] 代码块有语言标识
- [ ] 空行符合规范 (代码块前后有空行)
- [ ] 链接有效
- [ ] 中文和英文/数字之间有空格

4. 分批处理策略 ​

适用场景: 批量生成或修改文档

策略:

bash
# 第一批
生成/修改以下 5 个文档:
[列表]

每完成一个暂停让我确认

# 确认无误后
ok,继续下一批

好处:

  • 及时发现问题
  • 避免批量错误
  • 控制生成节奏

5. 配置变更安全策略 ​

变更前检查 ​

bash
@docs/.vitepress/config.ts

在修改配置前,请先:
1. 备份当前配置 (说明如何备份)
2. 列出变更影响
3. 说明回滚方法

不要写代码

变更后验证 ​

bash
配置修改完成

执行以下验证:
1. npm run docs:dev (检查开发服务器)
2. npm run docs:build (检查构建)
3. 检查关键页面
4. 检查控制台错误

如有错误,提供修复建议

第四部分: 常见问题 ​

Q1: 如何快速添加一批相似的文档? ​

回答: 使用场景 2 (批量生成函数文档)

关键点:

  • 准备结构化数据 (JSON/CSV)
  • 分批生成 (每批 5-10 个)
  • 统一更新配置

Q2: 文档格式不一致怎么办? ​

回答: 使用场景 3 (文档格式标准化)

步骤:

  1. 确定标准格式参考
  2. 对比并列出差异
  3. 逐个或批量修复

Q3: 如何重新组织文档结构? ​

回答: 使用场景 4 (导航配置优化)

注意:

  • 先分析后设计
  • 更新导航和侧边栏
  • 检查链接有效性

Q4: VitePress 配置修改失败怎么办? ​

回答: 使用工作流 4 (配置变更)

调试方法:

  1. 检查配置语法
  2. 检查依赖安装
  3. 查看控制台错误
  4. 参考官方文档

Q5: 如何提升构建和访问速度? ​

回答: 使用工作流 6 (性能优化)

常见优化:

  • 减少不必要的插件
  • 优化图片资源
  • 使用构建缓存
  • 启用代码分割

第五部分: 附录 ​

常用命令速查 ​

bash
# 开发服务器
npm run docs:dev
npm run dev:vite

# 构建
npm run docs:build

# 预览构建结果
npm run docs:preview

# 依赖安装
npm install [package-name]

文件路径速查 ​

类型路径
配置文件docs/.vitepress/config.ts
导航配置docs/.vitepress/nav.ts
侧边栏配置docs/.vitepress/sidebar.ts
主题配置docs/.vitepress/theme/index.ts
自定义样式docs/.vitepress/theme/style.css
PostgreSQL 文档docs/database/postgreSQL/ref/*.md
CSS 文档docs/vue/css/attr/*.md
TypeScript 文档docs/vue/typescript/*.md
AI 文档docs/AI/*.md

检查清单模板 ​

文档添加检查清单 ​

bash
- [ ] 文档内容完整
- [ ] 格式符合规范
- [ ] frontmatter 正确
- [ ] 代码示例有效
- [ ] 侧边栏已更新
- [ ] 链接有效
- [ ] 本地预览正常

配置变更检查清单 ​

bash
- [ ] 配置语法正确
- [ ] 依赖已安装
- [ ] 开发服务器正常
- [ ] 构建成功
- [ ] 功能验证通过
- [ ] 无控制台错误
- [ ] 性能无明显下降

使用建议 ​

  1. 新手入门

    • 阅读"快速开始"部分
    • 跟随场景 1 实践
    • 熟悉基本流程
  2. 日常使用

    • 根据需求查找对应场景
    • 跟随流程逐步操作
    • 灵活调整细节
  3. 复杂任务

    • 使用通用工作流程
    • 充分讨论方案
    • 分步实施验证
  4. 遇到问题

    • 查阅常见问题部分
    • 参考最佳实践
    • 必要时使用 ClaudeCode.md 中的基础模板

版本: v1.0 最后更新: 2025-10-22 适用: VitePress 文档项目