Claude Code Skills AI Agent技能扩展新手实战教程

时间：2026-06-17 14:54

Claude Code 的 Skills 彻底火了！新手也能看懂的 AI Agent 技能扩展实战教程摘要最近，AI 编程领域里 Claude Code 的热度持续攀升，其中一项备受关注的能力就是 Skills。简单来说，Skills 相当于为 Claude Code 安装的“专业技能包”：你可

Claude Code 的 Skills 彻底火了！新手也能看懂的 AI Agent 技能扩展实战教程

摘要

最近，AI 编程领域里 Claude Code 的热度持续攀升，其中一项备受关注的能力就是 Skills。简单来说，Skills 相当于为 Claude Code 安装的“专业技能包”：你可以将一套固定的开发流程、代码规范、项目规则、审查清单、部署步骤封装成一个 Skill，让 Claude Code 在需要时自动调用，或通过命令手动触发。

《Claude Code 的 Skills 彻底火了！新手也能看懂的 AI Agent 技能扩展实战教程》

本文面向初学者，从零开始讲清楚：

Claude Code Skills 是什么
Skills 与普通提示词的区别
Skills 的目录结构如何编写
如何创建自己的第一个 Skill
如何用 Skill 完成代码审查、Git 提交总结、前端组件生成
新手使用 Skills 的常见问题与避坑建议

1. Claude Code 是什么
2. Skills 是什么
3. 为什么 Claude Code Skills 会火
4. Skills 和普通提示词有什么区别
5. Skills 的基本目录结构
6. 第一个 Skill：自动总结 Git 修改内容
7. 第二个 Skill：代码审查助手
8. 第三个 Skill：前端组件生成助手
9. Skills 中常见配置字段说明
10. 新手常见问题
11. 最佳实践建议
12. 总结

1. Claude Code 是什么

Claude Code 是 Anthropic 推出的 AI 编程工具，你可以把它理解为一个运行在终端或 IDE 中的 AI 编程助手。它不仅能简单回答问题，更能直接参与到整个开发流程中。例如，它可以执行以下操作：

阅读整个项目代码
修改多个文件
运行命令
分析报错信息
编写测试用例
修复 Bug
生成提交信息
辅助代码审查
根据项目上下文完成开发任务

与普通聊天式 AI 不同，Claude Code 更像一个能进入项目目录、理解代码结构、执行实际开发任务的 AI Agent。

2. Skills 是什么

Skills 可以翻译为“技能包”或“能力包”。一个 Skill 本质上是一个文件夹，其中至少包含一个 SKILL.md 文件。这个文件会告诉 Claude Code：遇到什么任务时，应该如何处理。举个例子，如果你经常让 Claude Code 做这些事情：

帮我审查代码
帮我总结 Git diff
帮我生成接口文档
帮我写前端组件
帮我检查 SQL 是否有风险
帮我按照公司规范生成 commit message

如果每次都复制一大段提示词，非常麻烦。这时就可以把这些固定流程封装成 Skill。以后只需要输入类似命令：

/code-review

或者：

/summarize-changes

Claude Code 就会按照你提前写好的规则执行任务。

3. 为什么 Claude Code Skills 会火

Skills 火起来主要有 4 个原因。

3.1 它把提示词变成了工程化资产

以前我们使用 AI，经常是“临时写提示词”。比如：

请你帮我审查下面的代码，重点关注性能、安全性、边界条件、异常处理和可维护性。

这个提示词本身是有价值的，但每次都要重新写。Skills 的意义在于：它把这些提示词、规则、流程、模板沉淀成项目文件。AI 使用经验不再只是个人习惯，而可以变成团队资产。

3.2 它适合团队协作

对于团队来说，最怕的不是 AI 不会写代码，而是 AI 写出来的代码风格不统一。比如，有人喜欢函数式写法，有人喜欢面向对象写法，接口返回格式不统一，错误处理很随意，提交信息没有规范。如果团队把这些规范写成 Skills，Claude Code 就能按照统一标准工作。这对团队开发非常有价值。

3.3 它比普通提示词更可复用

普通提示词只能复制粘贴。Skills 可以直接放在项目中，例如：

.claude/skills/code-review/SKILL.md

这样每个项目都可以有自己的专属技能。比如：

前端项目有前端代码规范 Skill
后端项目有接口设计 Skill
数据分析项目有数据清洗 Skill
算法项目有模型评估 Skill
企业项目有内部开发流程 Skill

这就非常适合真实开发环境。

3.4 它更接近 AI Agent 的工作方式

AI Agent 的核心不是“回答问题”，而是“完成任务”。一个成熟的 Agent 不应该每次都靠用户解释任务，而应该具备可复用的工作流程。Skills 正好解决了这个问题：什么时候触发、读取什么上下文、按什么步骤执行、输出什么格式、是否允许运行命令、是否需要用户手动调用——这些都可以写进 Skill 中。

4. Skills 和普通提示词有什么区别

对比项	普通提示词	Claude Code Skills
使用方式	每次手动输入	保存为 Skill 后重复调用
可维护性	较差	较好
团队共享	不方便	可以直接放进项目
上下文管理	容易很长	按需加载
自动触发	一般不支持	可以根据描述自动触发
工程化程度	低	高
适合场景	临时问答	固定流程、团队规范、重复任务

一句话总结：普通提示词适合临时提问，Skills 适合沉淀长期可复用的 AI 工作流。

5. Skills 的基本目录结构

一个最简单的 Skill 结构如下：

.claude/ └── skills/ └── my-skill/ └── SKILL.md

其中：

.claude/skills/ 是项目中的 Skills 目录
my-skill 是 Skill 名称
SKILL.md 是 Skill 的核心说明文件

如果你想创建个人级 Skill，也可以放在用户目录下：

~/.claude/skills/my-skill/SKILL.md

项目级 Skill 只对当前项目生效。个人级 Skill 可以在多个项目中使用。

6. 第一个 Skill：自动总结 Git 修改内容

下面我们从一个最简单、最实用的例子开始。目标：创建一个 Skill，让 Claude Code 自动总结当前项目的 Git 修改内容，并指出潜在风险。

6.1 创建目录

在项目根目录下执行：

mkdir -p .claude/skills/summarize-changes

目录结构如下：

.claude/ └── skills/ └── summarize-changes/ └── SKILL.md

6.2 编写 SKILL.md

新建文件：

.claude/skills/summarize-changes/SKILL.md

写入以下内容：

---
name: summarize-changes
description: Summarize current git changes and identify possible risks. Use this when the user asks what changed, wants to review current modifications, or needs a commit summary.
---
## Current Git Diff
!`git diff HEAD`

## Instructions
You are a careful senior software engineer.
Please analyze the current Git diff and output:
1. A short summary of the main changes
2. Important files changed
3. Possible risks
4. Whether tests should be added or updated
5. A suggested commit message
Use Chinese in the final response.
Keep the result clear and concise.

6.3 使用这个 Skill

进入项目后启动 Claude Code：

claude

然后输入：

/summarize-changes

它就会读取当前 Git diff，并按照 Skill 中的要求总结修改。

6.4 这个例子有什么价值

这个 Skill 很适合新手使用，因为它可以帮助你：

看懂自己到底改了什么
检查是否遗漏测试
发现潜在风险
自动生成 commit message
提升提交代码前的自检质量

尤其是项目文件变多以后，手动看 diff 很容易漏问题，用 Skill 做一遍总结非常实用。

7. 第二个 Skill：代码审查助手

下面我们再写一个更实用的 Skill：代码审查助手。目标：让 Claude Code 按照固定维度审查当前修改。

7.1 创建目录

mkdir -p .claude/skills/code-review

7.2 编写 SKILL.md

---
name: code-review
description: Review the current code changes for correctness, maintainability, security, performance, and test coverage.
---
## Current Git Diff
!`git diff HEAD`

## Review Role
You are a strict but constructive senior code reviewer.

## Review Checklist
Please review the code changes from the following dimensions:
1. Correctness
   - Is the logic correct?
   - Are there any missing edge cases?
   - Are there possible null, undefined, or empty value issues?
2. Maintainability
   - Is the code readable?
   - Are function names and variable names clear?
   - Is the structure easy to extend?
3. Security
   - Is there any unsafe input handling?
   - Is sensitive data exposed?
   - Are permissions or authentication checks missing?
4. Performance
   - Are there unnecessary loops?
   - Are there repeated database queries?
   - Are there a voidable expensive operations?
5. Testing
   - Are tests missing?
   - Should existing tests be updated?
   - What test cases should be added?

## Output Format
Please output in Chinese using the following format:
### 总体评价
### 主要问题
### 潜在风险
### 修改建议
### 建议补充的测试

7.3 使用方式

/code-review

你也可以直接问：“帮我审查一下这次修改有没有问题”。如果描述匹配，Claude Code 也可能自动调用这个 Skill。

7.4 为什么代码审查适合做成 Skill

代码审查是典型的重复任务。每次审查都要关注逻辑正确性、边界条件、安全问题、性能问题、可维护性、测试覆盖。这些维度非常固定，所以很适合沉淀成 Skill。

8. 第三个 Skill：前端组件生成助手

下面我们写一个前端开发常用 Skill。目标：让 Claude Code 按照统一规范生成 React 组件。

8.1 创建目录

mkdir -p .claude/skills/react-component

8.2 编写 SKILL.md

---
name: react-component
description: Generate React components following project conventions. Use this when the user asks to create or refactor a React component.
argument-hint: [component-name]
---
## Role
You are a senior frontend engineer.

## Component Requirements
When generating React components, follow these rules:
1. Use TypeScript
2. Use functional components
3. Define clear Props types
4. Keep component logic simple
5. A void unnecessary state
6. Prefer composition over complex conditional rendering
7. Add basic loading and empty states when needed
8. Keep styles separated if the project already uses separate style files
9. Follow existing project naming conventions

## Output Requirements
When creating a component, provide:
1. Component file
2. Props definition
3. Example usage
4. Notes about edge cases
5. Suggestions for testing

## Style
Use clean, readable, production-oriented code.
A void over-engineering.
Explain important decisions in Chinese.

8.3 调用方式

/react-component UserCard

也可以直接告诉 Claude Code：“帮我写一个 UserCard 组件，展示用户头像、昵称、邮箱和状态”。如果描述匹配，Skill 就可以被使用。

8.4 示例组件代码

例如我们希望生成一个用户卡片组件，可以得到类似代码：

import React from "react";

type UserStatus = "active" | "inactive" | "pending";

interface UserCardProps {
  a vatarUrl: string;
  name: string;
  email: string;
  status: UserStatus;
}

export const UserCard: React.FC = ({
  a vatarUrl,
  name,
  email,
  status,
}) => {
  const statusTextMap: Record = {
    active: "正常",
    inactive: "停用",
    pending: "待确认",
  };

  return (
    
      
      

        
{name}
        {email}
        
          {statusTextMap[status]}
        
      
    
  );
};

对应样式可以写成：

.user-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background-color: #ffffff;
}
.user-card__a vatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
}
.user-card__content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.user-card__name {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}
.user-card__email {
  margin: 0;
  font-size: 14px;
  color: #6b7280;
}
.user-card__status {
  font-size: 12px;
}
.user-card__status--active {
  color: #16a34a;
}
.user-card__status--inactive {
  color: #dc2626;
}
.user-card__status--pending {
  color: #d97706;
}

9. Skills 中常见配置字段说明

SKILL.md 顶部通常会有一段 YAML 配置，例如：

---
name: code-review
description: Review code changes for correctness and maintainability.
argument-hint: [file-or-scope]
disable-model-invocation: true
allowed-tools: Read Grep Bash
---

常见字段如下。

9.1 name

name: code-review

表示 Skill 的展示名称。一般建议和文件夹名称保持一致，方便理解。

9.2 description

description: Review code changes for correctness and maintainability.

这是非常重要的字段。Claude Code 会根据 description 判断什么时候应该使用这个 Skill。新手写 description 时，建议包含三类信息：

这个 Skill 做什么 + 什么时候使用 + 适合什么任务

例如：

description: Review current git changes for bugs, risks, maintainability, and missing tests. Use when the user asks to review code or check modifications before commit.

9.3 argument-hint

argument-hint: [component-name]

这个字段用于提示用户调用 Skill 时应该传什么参数。例如：

/react-component UserCard

其中 UserCard 就是参数。

9.4 disable-model-invocation

disable-model-invocation: true

这个字段表示是否禁止 Claude 自动触发该 Skill。如果设置为 true，就只能用户手动调用。适合以下场景：

部署
删除文件
执行危险命令
修改数据库
批量重构

比如部署 Skill 最好手动调用，不要让 AI 自动触发。

9.5 allowed-tools

allowed-tools: Read Grep Bash

这个字段可以配置 Skill 允许使用的工具。新手建议谨慎使用，尤其是涉及：

文件删除
网络请求
数据库操作
部署命令
权限变更

AI Agent 越强，越要注意权限边界。

10. 新手常见问题

10.1 Skills 是不是等于插件？

不完全等于。插件通常更偏向“扩展工具能力”，而 Skill 更偏向“封装任务流程和上下文规则”。可以简单理解为：

插件 = 提供工具；Skill = 教 Claude 如何使用规则和流程完成任务

10.2 Skills 和 CLAUDE.md 有什么区别？

CLAUDE.md 更适合写项目的长期背景信息，例如：

项目架构
技术栈
编码规范
常用命令
项目注意事项

Skills 更适合写具体任务流程，例如：

如何审查代码
如何生成组件
如何部署项目
如何总结 Git 修改
如何生成接口文档

简单理解：

CLAUDE.md：告诉 Claude 这个项目是什么；Skills：告诉 Claude 遇到某类任务时怎么做

10.3 Skill 写得越长越好吗？

不是。Skill 不是越长越好，而是越清晰越好。建议遵循：

目标明确
步骤清楚
输出格式固定
不写无关背景
不把所有规则塞进一个 Skill

一个 Skill 最好只解决一类问题。

10.4 Skill 可以放代码文件吗？

可以。一个复杂 Skill 可以包含：

my-skill/ ├── SKILL.md ├── examples/ │ └── example-output.md ├── templates/ │ └── component-template.tsx └── scripts/ └── validate.sh

其中：

SKILL.md 写核心说明
examples 放示例输出
templates 放模板
scripts 放辅助脚本

这样 Skill 会更像一个完整的小型工具包。

10.5 为什么我的 Skill 没有触发？

常见原因有：

description 写得太模糊
Skill 目录放错了
SKILL.md 文件名写错了
当前 Claude Code 没有读取到该目录
任务描述和 Skill 的用途不匹配
设置了 disable-model-invocation: true

建议先用手动命令测试：

/skill-name

如果手动可以调用，说明 Skill 本身基本没问题。如果想让它自动触发，就要优化 description。

11. 最佳实践建议

11.1 一个 Skill 只做一件事

不要写一个“万能开发助手 Skill”。不推荐：

这个 Skill 负责代码审查、组件生成、接口设计、数据库优化、部署上线、文档生成。

推荐拆成多个 Skill：

.claude/skills/code-review/ .claude/skills/api-design/ .claude/skills/react-component/ .claude/skills/sql-review/ .claude/skills/release-note/

这样更清晰，也更容易维护。

11.2 description 一定要写具体

不好的写法：

description: Help with code.

好的写法：

description: Review current git changes for bugs, security risks, maintainability issues, and missing tests before commit.

因为 Claude Code 判断是否调用 Skill，主要依赖描述信息。描述越准确，触发越稳定。

11.3 输出格式要固定

如果你希望每次结果都稳定，就要写清楚输出格式。例如：

## Output Format
Please output with the following sections:
1. Summary
2. Problems
3. Risks
4. Suggested changes
5. Suggested tests

这样 Claude Code 的输出就不会太散。

11.4 危险操作必须手动触发

涉及以下操作时，建议设置：

disable-model-invocation: true

包括：

部署生产环境
删除文件
修改数据库
批量重构
执行 shell 脚本
推送代码
创建 release

AI Agent 可以提高效率，但不能把关键权限完全交出去。

11.5 让 Skill 成为团队规范的一部分

如果是团队项目，可以把 Skills 放在项目中：

.claude/skills/

然后随代码一起提交到仓库。这样每个团队成员使用 Claude Code 时，都可以共享同一套 AI 工作流程。这对团队规范化非常有帮助。

12. 总结

Claude Code Skills 的核心价值不是“多一个功能”，而是让 AI 编程从临时对话走向工程化。以前我们使用 AI，更多是“我问一句，AI 答一句”。而有了 Skills 之后，开发流程会变成“把重复任务沉淀成 Skill，让 AI 按照固定流程完成”。

对于新手来说，建议先从这 3 个 Skill 开始：

summarize-changes # 总结 Git 修改 code-review # 代码审查 react-component # 生成前端组件

等熟悉之后，再逐步扩展：

api-design # 接口设计 sql-review # SQL 审查 release-note # 版本说明 deploy-staging # 测试环境部署 test-writer # 自动生成测试

Claude Code Skills 本质上是把你的开发经验、团队规范和重复工作流程，封装成 AI 可以复用的技能包。

如果说 Claude Code 是一个 AI 程序员，那么 Skills 就是给这个 AI 程序员安装的专业工作手册。谁能更早把自己的工作流沉淀成 Skills，谁就能更快进入 AI Agent 编程时代。

来源：https://blog.csdn.net/wang20000102/article/details/161897014

Claude

上一篇年AI大模型新手零基础入门到精通完整教程 下一篇Midjourney保姆级入门教程零基础AI绘图附安装包

本站内容用于信息整理与展示，如有侵权或内容问题请及时联系处理。