claude-code编程AI入门使用手册

1. Claude Code 简介与安装

1.1 什么是 Claude Code

Claude Code 是 Anthropic 官方推出的命令行 AI 编程助手，专为开发者设计。它既是独立的 CLI 工具，也可作为插件集成到主流编辑器中。

核心特性：

🛠️ CLI 优先：直接在终端中运行 claude 命令进行交互
🔌 编辑器集成：支持 VS Code、JetBrains IDE（WebStorm/IntelliJ）、Trae等编辑器插件
🤖 多模型支持：可接入 Claude 系列模型（Sonnet、Opus、Haiku）
📁 项目感知：通过 CLAUDE.md 文件理解项目上下文和规范
🧩 模块化架构：支持 Skills（技能包）、Subagents（子智能体）、MCP（外部工具连接）

一句话总结： 在终端或编辑器中直接对话的 AI 结对编程伙伴，能理解你的代码库并提供精准帮助。

1.2 环境准备

在安装 Claude Code 前，请确保你的开发环境满足以下要求：

📋 系统要求

Node.js：版本 18 或更高（推荐 LTS 版本）
Git：已安装并配置用户信息
包管理器：npm 或 yarn（npm 随 Node.js 自动安装）
终端：支持 Bash、Zsh、PowerShell 等

✅ 验证通过标准

node --version 显示 v18.x.x 或更高
git --version 显示版本号且配置信息完整
终端可正常执行 npm 命令

1.3 安装步骤

1.3.1 全局安装 Claude Code

npm install -g @anthropic-ai/claude-code

1.3.2 编辑器插件安装

在编辑器中搜索并安装 Claude Code 插件。

Claude Code 插件安装

1.3.3 验证安装

在终端中输入以下命令验证 Claude Code 的能力：

claude
：你是什么模型？有什么能力？全部列举，简短回答

Claude Code 能力验证

1.3.4 初始化项目

项目初始化是让 Claude Code 理解你的代码库结构和开发规范的关键步骤。

🚀 初始化流程

启动 Claude Code 并执行初始化：

claude
/init

📝 /init 命令功能

/init 命令会自动分析你的项目并生成关键配置文件：

分析现有文档：读取 README.md、package.json 等文件
生成 CLAUDE.md：在项目根目录创建项目配置文件
补充缺失文档：如果 README.md 不存在或内容不足，会自动生成
理解项目结构：分析目录布局、技术栈和开发规范

🛠️ 后续优化

如果对生成的文档不满意，可以手动优化：

# 重新生成 README.md
生成这个项目的 README.md

# 基于更新后的 README.md 重新生成 CLAUDE.md
参考最新的 README.md，重新生成 CLAUDE.md

⚠️ 注意事项

/init 命令会读取项目文件，请确保不包含敏感信息
生成的文件可能需要根据项目特点手动调整
大型项目初始化可能需要较长时间

1.3.5 第三方Skill集成

1.3.5.1 UI UX Pro Max

什么是UI UX Pro Max？
UI UX Pro Max 是一个专为 AI 编程助手打造的设计智能技能包，它通过强大的设计数据库和语义搜索功能，帮助开发者快速生成符合行业标准的界面设计方案。

核心能力：

🎨 设计数据库：包含数千个行业标准的设计模式和组件
🔍 语义搜索：通过自然语言描述搜索合适的设计方案
🛠️ 多平台适配：支持 Web、移动端、桌面应用等多种平台
📱 多框架支持：适配 Vue、React、Angular 等主流前端框架
🤖 AI助手集成：专为 Claude Code、Cursor、Windsurf 等 AI 编程助手优化

安装与初始化

# 1. 全局安装 UI Pro CLI
npm install -g uipro-cli

# 2. 验证安装
uipro --version

# 3. 在项目中初始化（针对Claude Code）
uipro init --ai claude

# 4. 查看生成的配置文件
ls -la .claude/skills/

初始化后生成的文件：

项目目录/
├── .claude/
│   └── skills/
│       └── ui-ux-pro-max/
│           └── SKILL.md    # UI UX Pro Max 技能配置文件

配置文件说明：

SKILL.md 文件包含了 UI UX Pro Max 的所有配置和指令
你可以根据需要修改这个文件来定制设计规则和偏好
修改后无需重新安装，Claude Code 会自动加载更新后的配置

命令行使用示例

提示：以下示例都是在Claude Code会话中直接输入的自然语言命令，UI UX Pro Max会自动识别并调用相应的设计功能。

1. 基本设计生成

# 在Claude Code会话中直接输入：
生成一个用户登录页面的设计，包含邮箱/密码输入和第三方登录选项

2. 特定风格设计

# 在Claude Code会话中直接输入：
设计一个深色主题的管理后台仪表板，使用Material Design组件

3. 响应式布局

# 在Claude Code会话中直接输入：
创建一个电商商品列表页，支持桌面、平板和手机三种视图

4. 设计系统生成

# 在Claude Code会话中直接输入：
为我的SaaS应用创建一套完整的设计系统，包括颜色、字体、间距和组件规范

常用工作流程

场景1：快速原型设计

1. 在Claude Code中输入设计需求
2. UI UX Pro Max 自动搜索合适的设计模式
3. 生成完整的界面代码和设计说明
4. 根据需要调整和优化

场景2：设计规范制定

1. 描述你的品牌风格和设计需求
2. 生成完整的设计系统文档
3. 导出可复用的设计组件
4. 集成到现有项目中

场景3：多平台适配

1. 指定目标平台（Web、iOS、Android）
2. 生成平台特定的设计规范
3. 提供跨平台的一致性建议
4. 生成对应的代码实现

最佳实践

明确需求：在请求设计时尽可能详细描述需求
提供上下文：说明项目类型、目标用户和技术栈
迭代优化：先生成基础设计，再逐步优化细节
保持一致性：使用相同的设计语言和组件库
测试可用性：生成设计后在实际设备上测试体验

技术栈适配提示：

Vue + Element Plus：适合企业级后台管理系统
React + Ant Design：适合中台和业务系统
移动端优先：优先考虑移动端体验，再适配桌面端
无障碍设计：考虑可访问性要求，确保符合WCAG（Web内容可访问性指南）标准

1.3.5.2 OpenSpec规范驱动开发

什么是OpenSpec？
OpenSpec 是一个为 AI 编码助手设计的规范驱动开发工具，它通过轻量级的工作流程，确保人类开发者和 AI 助手在编写任何代码之前就能对需求达成明确共识。

核心价值：

🎯 需求对齐：在编码前明确需求，避免返工
📋 规范先行：先写规范，再写代码，确保质量
🤝 人机协作：为AI助手提供清晰的开发指导
🔄 变更管理：系统化地管理功能变更和需求演进

安装与初始化

# 1. 安装OpenSpec CLI
npm install -g @fission-ai/openspec@latest

# 2. 验证安装
openspec --version

# 3. 在项目中初始化OpenSpec
openspec init

# 4. 查看已创建的变更规范
openspec list

初始化后需要做的事：

阅读生成的 openspec/project.md 文件
根据你的项目特点填写项目信息、技术栈和开发约定
根据需要将相关文档翻译为中文

核心工作流命令

OpenSpec 的核心工作流围绕三个关键命令展开，对应开发的不同阶段：

1. 📝 /openspec:proposal - 创建变更提案

用途：为新的功能、修改或删除创建详细的规范提案
场景：开始新功能开发前，或需要对现有功能进行重大变更时
作用：生成结构化的需求文档，确保AI理解你的意图

2. 🚀 /openspec:apply - 应用变更规范

用途：基于已批准的提案开始实际编码工作
场景：提案审核通过后，开始实现功能
作用：指导AI按照规范要求编写代码，确保实现符合预期

3. 📁 /openspec:archive - 归档已完成变更

用途：标记变更已完成，清理工作空间
场景：功能开发完成并通过测试后
作用：保持变更列表整洁，便于管理历史记录

使用示例：

# 场景：需要添加用户登录功能
1. 在Claude Code中输入：/openspec:proposal
2. 描述需求："添加用户登录功能，支持邮箱/密码登录和第三方登录"
3. AI会生成详细的规范文档供你审核
4. 审核通过后输入：/openspec:apply
5. AI开始按照规范实现登录功能
6. 功能完成后输入：/openspec:archive

常用管理命令

# 查看所有活动变更（未归档的）
openspec list

# 交互式查看变更仪表板
openspec view

# 查看特定变更的详细信息
openspec show <变更名称>

# 验证规范格式是否正确
openspec validate <变更名称>

# 交互式归档变更（会询问确认）
openspec archive <变更名称>

# 非交互式归档（直接归档）
openspec archive <变更名称> --yes

# 刷新AI指导，重新生成Claude Code命令
openspec update

规范格式模板

## ADDED Requirements          # 新增功能需求
## MODIFIED Requirements       # 修改功能需求（必须包含完整的新文本）
## REMOVED Requirements        # 移除功能需求

最佳实践：

先提案，后编码：始终使用 /openspec:proposal 开始新工作
明确边界：在提案中清晰定义功能范围和限制
定期归档：完成的工作及时归档，保持列表整洁
版本控制：将规范文档纳入Git版本管理

2. Claude Code 基础使用指南

2.1 基本命令

命令	功能描述	使用场景	示例
`/clear`	清除本次上下文	开始新任务时清理历史	`/clear`
回档	回档（撤消改动、回滚）	操作失误时恢复	`回滚`
`/model`	切换模型	需要不同模型能力时	`/model sonnet`
`/cost`	查看当前会话使用情况	监控资源消耗	`/cost`
`/compact`	清除对话历史记录，保留上下文摘要	清理历史但保留关键信息	`/compact`
`/quit`	退出 Claude Code	结束会话	`/quit`
`/help`	显示帮助信息	查看可用命令	`/help`
`/resume`	恢复历史会话	继续之前的工作	`/resume`
`/tasks`	查看后台任务	监控运行中的任务	`/tasks`

常用命令速查：

# 快速开始新任务
/clear

# 查看当前花费
/cost

# 切换为 Sonnet 模型（平衡性能与成本）
/model sonnet

# 退出会话
/quit

2.2 文件引用功能

在对话中输入 @ 符号可以引用文件、文件夹等，让 AI 理解上下文：

基本用法：

# 引用单个文件
@README.md 帮我优化这个文档

# 引用文件夹
@src/components/ 分析这个组件目录的结构

# 引用多个文件
@package.json @tsconfig.json 查看项目配置

高级用法：

# 引用并指定操作
@src/utils/date.ts 优化这个日期工具函数

# 引用并对比
@old-version.js @new-version.js 对比这两个文件的差异

# 引用并生成文档
@src/api/user.ts 为这个API文件生成使用文档

文件引用规则：

支持相对路径和绝对路径
支持通配符：@src/**/*.ts（所有TypeScript文件）
支持多个文件同时引用
文件不存在时会提示错误

2.3 思考模式

2.3.1 命令行

在 Claude Code 中，可以使用 "think" 这个词来激活深度思考模式，包括以下几种级别（思考深度递增）：

思考级别：

think - 轻度思考
think hard - 中度思考
think harder - 深度思考
ultra think - 极限思考（最费钱但能力最强）

使用示例：

# 简单问题
1+1=？think

# 复杂算法问题
实现一个快速排序算法 think hard

# 架构设计问题
设计一个微服务架构 think harder

# 最难的问题
证明哥德巴赫猜想 ultra think

成本提示：

think：成本最低，适合简单问题
think hard：中等成本，适合复杂问题
think harder：较高成本，适合架构设计
ultra think：最高成本，发挥 Claude 最大潜能

最佳实践：

先用 think 测试简单问题
复杂问题用 think hard
架构设计用 think harder
只有最重要的问题才用 ultra think

2.3.2 界面交互

快捷键： Tab 开启/关闭（实时切换）

功能： 显示 AI 的推理过程（灰色斜体文字），让你看到 Claude 的"内心活动"

适用场景：

调试 AI 思路： 想看 AI 怎么思考的
发现问题： AI 答案有问题时进行调试
纠正误解： 发现 AI 理解错了需求时
学习 AI： 了解 AI 解决问题的方法

使用示例：

# 开启思考模式后提问
Tab
帮我优化这个函数...

# 看到思考过程后可以干预
等等，你理解错了，我需要的是...

# 关闭思考模式
Tab

思考模式显示的内容：

问题分析过程
方案选择理由
代码实现思路
潜在问题考虑

思考模式示例

2.4 执行模式切换

快捷键： Shift + Tab（循环切换）

2.4.1 Normal Mode - 默认模式（新手推荐）

特点： 所有操作都询问用户，AI 不会擅自行动
适用场景： 不熟悉文件夹结构，或处理重要内容时（重要文档、核心代码等）
提示： 每次操作前都会显示 ⚠️ 危险操作检测！ 确认框

2.4.2 Accept Edits - 自动编辑（日常使用）

特点： AI 可以自动修改文件，但运行命令时仍会询问
适用场景： 日常工作，信任 AI 的改动（整理文档、优化内容、批量处理等）
提示： 文件编辑自动执行，但 git、npm 等命令仍需确认

2.4.3 Plan Mode - 先看计划（复杂任务用）

特点： AI 先列出完整计划，用户审查后再执行
适用场景： 复杂功能开发，想先看清楚 AI 要做什么
流程： 分析 → 计划 → 用户批准 → 执行

2.4.4 Bypass Permissions - 完全自动（⚠️ 危险！）

特点： AI 可以做任何事，不询问用户（包括删除文件！）
适用场景： 批量自动化操作（文件整理、格式转换、数据处理）
激活方式： 启动时加 --dangerously-skip-permissions 参数
警告： 可能误删文件，仅限信任的环境使用

模式选择指南：

# 启动时指定模式
claude --mode accept-edits

# 临时切换模式（会话中）
我现在要处理一些简单文档整理，切换到 Accept Edits 模式

自动启动设置：

# 或使用提示词让 Claude 帮你设置
帮我设置 Claude Code 自动以 bypass permissions 模式启动。
当我输入 claude 时，自动执行 claude --dangerously-skip-permissions

2.5 恢复历史会话

Claude Code 会自动保存你的对话历史，可以通过多种方式恢复：

2.5.1 非交互模式（启动时恢复）

在终端中直接使用带参数的命令：

命令	功能	使用方式	示例
`claude --continue` 或 `claude -c`	自动继续最近的对话	无需任何提示	`claude -c`
`claude --resume` 或 `claude -r`	显示历史对话选择器	选择要恢复的会话	`claude --resume`

注意： 这两个带参数的命令需要在「非交互模式」下进行，也就是还没有进入 Claude Code 会话时。

2.5.2 交互模式（会话中恢复）

如果已经进入了 Claude Code 会话，可以使用 /resume 命令：

# 在 Claude Code 会话中输入
/resume

# 使用方向键选择要恢复的会话
↑ ↓ 选择会话，Enter 确认

操作步骤：

输入 /resume 命令
使用上下方向键浏览历史会话列表
按 Enter 键恢复选中的会话
继续之前的对话

2.5.3 查看所有历史会话

# 查看会话列表（带时间戳）
claude --list-sessions

# 查看会话详情
claude --show-session <会话ID>

2.5.4 管理历史会话

# 删除特定会话
claude --delete-session <会话ID>

# 清理所有历史会话
claude --clear-sessions

# 导出会话记录
claude --export-session <会话ID> > conversation.txt

最佳实践：

重要会话命名： 在重要对话开始时说明主题，便于后续查找
定期清理： 清理不再需要的会话记录
备份重要对话： 导出重要的技术讨论或解决方案
使用 --continue： 日常开发中使用 claude -c 快速继续工作

3. Claude Code 架构组件概述

3.1 核心组件介绍

Claude Code 的整体架构包括以下五个核心组件，它们协同工作形成一个完整的 AI 编程助手生态系统：

Prompts（提示词）：你在对话中给 Claude 的即时指令
- 用途：处理当前的具体需求，灵活但不持久
- 类比：就像当面给同事的口头指示
Projects（工作空间）：长期项目的工作空间
- 用途：CLAUDE.md 是 Projects 功能的具体载体，它包含了项目所需的所有上下文信息
- 类比：整个项目文件夹（包含所有文件）
Skills（技能包）：可复用的操作手册和资源包
- 用途：让 Claude 稳定地按同一套方法完成重复性任务
- 类比：标准作业流程（SOP）
Subagents（子智能体）：分工明确的专业助手
- 用途：独立处理专门任务，实现权限隔离和并行处理
- 类比：专业领域的专家顾问
MCP（模型上下文协议）：外部工具连接协议
- 用途：让 Claude 接入数据库、API 等外部数据源
- 类比：系统的扩展接口，用于连接 Claude Code 与外部工具

3.2 组件关系与协作

这些组件按照以下顺序协同工作，形成一个完整的 AI 编程助手生态系统：

Prompts 提供即时指令：处理当前对话的具体需求
Projects 提供持久上下文：长期项目中的内容积累和连续性
Skills 提供稳定能力：确保重复性任务的质量一致性
Subagents 提供专业分工：复杂任务的并行处理和权限隔离
MCP 提供外部连接：扩展 Claude Code 的能力边界

4. CLAUDE.md文件详解

4.1 什么是CLAUDE.md文件？

CLAUDE.md 是 Claude Code 的"项目备忘录"，一个特殊的配置文件，用于告诉 Claude Code 项目的组织结构、开发约定、技术规范和流程。

存放位置： 项目根目录，团队共享

核心价值： 将项目关键信息写入 CLAUDE.md，让 Claude Code 从对话开始就"对齐上下文"，避免重复解释。

4.2 文件内容要点

为 Claude Code 补充项目背景、明确工作流程、说明常用工具和约定。重点记录实际开发中需要反复解释的内容。

记录内容：

常用 bash 命令
关键工具类
编码规范
测试方法
仓库结构
环境搭建步骤
常见注意事项

格式要求： 简洁易读，便于团队成员和 Claude Code 快速理解。

4.3 /init 之后，下一步做什么？

执行 /init 命令生成 CLAUDE.md 后：

# 1. 检查生成内容的准确性
# 2. 补充项目特有的"潜规则"
# 3. 精简通用内容，保留项目相关部分
# 4. 提交到版本控制系统

具体步骤：

验证信息： 确保生成的项目结构、技术栈等信息正确
补充细节： 添加分支命名规范、部署流程、代码审查要求等
优化内容： 删除不相关的通用指导，聚焦项目实际需求
版本管理： 提交 CLAUDE.md 到 Git，方便团队共享

4.4 编写原则

聚焦核心： 只记录最关键的项目结构、构建命令、常用脚本
拆分辅助： 将辅助信息拆分为独立文件（如 testing.md、deploy.md），在 CLAUDE.md 中引用
保持简洁： 避免冗长，确保信息密度高

4.5 安全注意事项

CLAUDE.md 会成为 Claude Code 的系统上下文，通常提交到仓库与团队共享。切勿包含敏感信息：

API Key
数据库连接字符串
私有证书
详细安全漏洞信息

安全原则： 将 CLAUDE.md 视为可能公开的文档来编写。

5. 高级功能

5.1 自定义命令

把常用提示词变成快捷命令，一键触发常用操作。

5.1.1 创建命令

直接复制这个提示词给 Claude：

帮我创建一个自定义命令。

如果我没说清楚，请先问我：
1. 命令叫什么名字？（比如：整理笔记、写总结、格式转换、润色文章）
2. 这个命令要做什么？（详细说明功能）

5.1.2 命令文件位置

创建后保存到：.claude/commands/[命令名].md

5.1.3 命令模板

---
description: [一句话说明这个命令是干什么的]
argument-hint: [命令参数提示（可选）]
---

[详细描述这个命令要做什么事情，怎么做]

如果需要接收参数，可以用 $ARGUMENTS 变量。

自定义命令示例

5.1.4 性能优化命令示例

手动创建命令文件：
创建 .claude/commands/performance-optimization.md，内容写入你的标准性能优化指令。

之后在任何对话中输入：

/performance-optimization myfile.py

performance-optimization.md 内容示例：

# 性能优化
分析所提供的代码，以找出性能瓶颈并寻找优化机会。进行全面审查，内容包括：

## 需要分析的方面
### 数据库与数据访问
- N+1 查询问题及缺失的主动加载
- 常用查询列缺乏数据库索引
- 连接或子查询效率低下
- 大结果集缺少分页功能
- 缺乏查询结果缓存
- 连接池问题

### 算法效率
- 时间复杂度问题（如 O(n²) 或更差的情况，若存在更优的算法则应予以改进）
- 可能存在优化空间的嵌套循环
- 重复计算或重复工作
- 数据结构选择不当
- 缺少记忆化或动态规划的运用机会

### 内存管理
- 内存泄漏或保留引用
- 在流处理可行的情况下加载整个数据集
- 循环中过度实例化对象
- 不必要的将大型数据结构保留在内存中
- 缺乏垃圾回收的机会

### 异步与并发
- 应该采用异步方式处理的阻塞式 I/O 操作
- 可以并行运行的顺序性操作
- 缺少 Promise.all() 或并发执行模式
- 同步的文件操作
- 未优化的工作者线程使用方式

### 网络与 I/O
- 过多的 API 调用（缺少请求批量处理）
- 无响应缓存策略
- 大量数据未进行压缩
- 静态资产未使用 CDN
- 缺乏连接复用机制

### 前端性能
- 带有阻塞效果的 JavaScript 或 CSS
- 缺少代码拆分或延迟加载
- 未优化的图片或资源
- 过多的 DOM 操作或重绘
- 长列表缺少虚拟化技术
- 对耗时操作未使用节流/防抖机制

### 缓存
- 缺少 HTTP 缓存头信息
- 没有应用级别的缓存层
- 未为纯函数实现记忆化功能
- 静态资源未设置缓存过期机制

## 输出格式
对于所识别出的每一个问题：
1. **问题**：描述该性能故障的情况
2. **位置**：请注明文件/函数/行号
3. **影响**：确定严重程度（危急/高/中/低）并说明预期的性能下降情况
4. **当前复杂度**：如适用，请注明时间/空间复杂度
5. **建议**：提供具体的优化方案
6. **代码示例**：尽可能展示优化后的版本
7. **预期改进**：若可衡量，则量化性能提升情况

如果代码经过了优化处理：
- 确认优化状态
- 列出已正确实施的性能最佳实践
- 记录任何可能的微小改进之处

**需要审查的代码：**```$参数```

5.2 子智能体(Subagents)

5.2.1 功能介绍

与 Command 的区别：

Command（命令）： 需要用户主动调用（输入 /命令名）
SubAgent（子智能体）： 能自动触发！当用户说相关的话，AI 自动启动对应的助手

核心能力：

独立的上下文（不污染主对话）
可配置工具权限（精确控制能力）
自定义系统提示（专业化行为）

5.2.2 创建步骤

输入 "/agent" 可以看到所有可用的 agent：

image.png

创建新 agent 步骤（跟着图走就行）：

输入 "/agent"，选择 agents

image.png
创建新 agent

image.png
选第一个，根据文件夹生成

image.png
选自动生成（推荐）

image.png
输入你的要求

image.png
AI 开始自动生成

image.png
选择工具权限（继续就行，默认全勾上）

image.png
选择模型（推荐 sonnet）

image.png
选颜色（对话时的显示颜色）

image.png
确认信息，按 enter

image.png
完成！文件在 .claude/agents/ 文件夹里

image.png

5.2.3 使用方法

方式1：主动调用
输入 @agent 选择需要的助手

image.png

方式2：让 AI 自动识别（更智能！）
装好后自动工作，用户说相关的话就会启动。

示例：

装了"文章润色"助手：用户说"帮我优化这篇文章"，助手自动跳出来
装了"知识整理"助手：用户说"整理一下这些笔记"，助手自动开始工作
装了"代码审查"助手：用户说"检查一下代码"，助手自动分析

5.3 MCP服务管理

5.3.1 功能介绍

MCP（Model Context Protocol）服务可以连接 Claude 到外部工具（数据库、API、浏览器等），扩展能力边界！

5.3.2 安装 MCP

Claude Code 添加 MCP 需要执行终端命令，可以使用以下提示词：

帮我管理 MCP 服务（添加或删除）。

我会提供配置信息，格式如下：
{
  "mcpServers": {
    "服务名": {
      "command": "命令",
      "args": ["参数列表"]
    }
  }
}

请你根据我的需求：

**添加服务**
1. 提取配置中的服务名、command、args
2. 转换成命令：claude mcp add-json <服务名> '{"command": "xxx", "args": [...]}'
3. 执行安装
4. 安装完成后测试是否可用

**删除服务**
使用命令：claude mcp remove <服务名>

使用方式： 复制提示词，然后提供你要安装的 MCP 配置。

MCP安装示例

5.3.3 管理 MCP

查看状态： 输入 /mcp 就能看到所有已安装的服务

MCP状态查看

状态详情：

MCP状态详情

5.3.4 使用 MCP

在对话中注明 MCP 名称，AI 会自动调用。如果语义不明确，调用概率会降低。

5.4 Skills技能包

5.4.1 Skills 技能包定义

Skills是"文件夹式"的专业能力包，包含指令说明、脚本和资源文件。Claude在处理任务时会动态扫描并加载相关Skills，在特定领域提供更稳定、专业的支持。

加载机制：
Skills采用渐进式加载机制：

元信息加载：约100 tokens，用于判断Skill相关性
完整说明加载：需要时加载，不超过5k tokens
资源文件加载：实际使用时才加载相关脚本和文件

5.4.2 如何命名 Skill

每个Skill必须包含三个核心组件：名称、描述、指令。名称和描述决定了Skill的触发逻辑。

命名规则：

使用小写字母和连字符（如：pdf-editor、brand-guidelines）
名称要简洁直观，避免冗长描述

描述要点：

能力：具体描述Skill能做什么
触发条件：明确调用场景
上下文：说明使用情境
边界：指出不适用的场景

5.4.3 如何在 Claude Code 中加载你的 Skill

操作步骤：

创建Skill文件夹：在项目根目录创建skills/文件夹
添加SKILL.md文件：在skills/下创建子文件夹（如my-skill/），添加SKILL.md文件
自动加载：Claude Code会自动识别并加载Skill

目录结构示例：

my-project/
├── skills/
│   └── my-skill/
│       └── SKILL.md

5.4.4 创建实用 Skill 的技巧

从真实痛点出发
- 只为核心重复性任务创建Skill
- 确认任务已重复5次以上，且未来还会重复10次以上
明确质量标准
- 在Skill指令中定义清晰的输出标准
- 包括结构、格式、验证规则和质量阈值
善用 Skill-Creator 工具
- 帮助构建结构化Skill
- 引导需求清晰化，优化描述字段
- 规范格式，便于维护

5.4.5 Skill 触发机制

Claude通过语义理解判断请求与Skill的相关性，而非简单关键词匹配。

注意事项：

避免模糊描述：清晰请求才能准确触发对应Skill
避免多重触发：复杂任务可能同时激活多个相关Skill
避免遗漏触发：Skill描述需覆盖所有关键用例

5.4.6 适用场景

当需要Claude稳定、重复、高效完成专业任务时，优先使用Skills。

典型场景：

组织级工作流：品牌规范、合规流程、文档模板
领域型能力：Excel建模、PDF处理、数据分析
个人偏好：笔记规则、代码风格、调研方法

5.4.7 目前流行的第三方Skills包（一般通过npm安装）

除了自定义Skills外，社区还提供了许多优秀的第三方Skills包，可以通过npm安装使用。这些包通常针对特定领域或任务进行了深度优化。

安装方式：

# 全局安装第三方Skills包
npm install -g <skill-package-name>

# 或在项目中安装
npm install <skill-package-name> --save-dev

流行的第三方Skills包：

UI/UX设计类
- @fission-ai/ui-ux-pro-max：专业UI/UX设计技能包，包含数千个行业标准设计模式和组件
- @claude-skills/design-system：设计系统生成和管理工具
- @ai-design-tools/material-builder：Material Design组件生成器
代码质量类
- @claude-skills/code-review：自动化代码审查，支持多种编程语言
- @ai-dev-tools/security-audit：代码安全审计和漏洞检测
- @claude-skills/performance-optimizer：性能分析和优化建议
文档处理类
- @claude-skills/pdf-expert：PDF文档处理、提取、转换和编辑
- @ai-docs/markdown-pro：Markdown文档增强和格式化
- @claude-skills/api-documenter：自动生成API文档
数据科学类
- @claude-skills/data-analysis：数据分析和可视化
- @ai-ml/pandas-helper：Pandas数据处理助手
- @claude-skills/sql-expert：SQL查询优化和数据库设计
项目管理类
- @fission-ai/openspec：规范驱动开发工具（已在1.3.5.2节介绍）
- @claude-skills/project-manager：项目管理、任务分解和进度跟踪
- @ai-dev-tools/git-workflow：Git工作流优化和自动化
前端开发类
- @claude-skills/vue-expert：Vue.js开发最佳实践和组件生成
- @claude-skills/react-helper：React组件开发和状态管理
- @ai-frontend/css-optimizer：CSS优化和样式规范检查
后端开发类
- @claude-skills/nodejs-expert：Node.js后端开发和API设计
- @ai-backend/database-designer：数据库设计和ORM配置
- @claude-skills/api-builder：RESTful API和GraphQL API生成

集成到Claude Code：

大多数第三方Skills包会自动集成到Claude Code中，安装后即可使用。部分包可能需要手动配置：

# 安装后可能需要初始化
<skill-package-name> init --ai claude

# 或手动添加到.claude/skills/目录
cp -r node_modules/<skill-package-name>/skills/* .claude/skills/

使用示例：

# 在Claude Code会话中直接使用
# 安装UI UX Pro Max后
生成一个用户登录页面的设计，包含邮箱/密码输入和第三方登录选项

# 安装Code Review后
审查src/components/UserForm.vue的代码质量

# 安装Data Analysis后
分析这个CSV文件的数据分布和统计特征

选择建议：

评估需求：根据实际开发需求选择合适的Skills包
查看文档：安装前查看包的文档和示例
测试兼容性：确保与当前Claude Code版本兼容
关注更新：定期更新以获得最新功能和修复

注意事项：

第三方Skills包可能依赖特定版本的Claude Code
部分包可能需要额外的配置或环境变量
注意包的许可证和商业使用限制
建议在开发环境中先测试，再应用到生产项目

6. 总结

本指南详细介绍了 Claude Code 的安装、配置、使用技巧和高级功能。通过合理利用 Claude Code 的各项功能，可以显著提高开发效率和代码质量。

核心要点：

正确初始化： 使用 /init 命令生成 CLAUDE.md，确保项目上下文对齐
合理选择模式： 根据任务复杂度选择合适的执行模式
善用高级功能： MCP、Skills、Subagents 等可以扩展 Claude Code 的能力边界
安全第一： 注意敏感信息保护，避免在配置文件中泄露关键信息

通过持续学习和实践，你可以更好地利用 Claude Code 这个强大的 AI 编程助手，提升开发效率和代码质量。