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

2026-06-20阅读 0热度 0
Claude

Claude Code Skills 引爆开发者圈:从零搭建 AI Agent 技能扩展实战指南

概述

近期,Claude Code 在 AI 编程领域掀起热潮,其中最受瞩目的功能莫过于 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 的爆火主要源于四个原因。

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}

{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 没有触发?

常见原因有:

  1. description 写得太模糊
  2. Skill 目录放错了位置
  3. SKILL.md 文件名写错了
  4. 当前 Claude Code 没有读取到该目录
  5. 任务描述与 Skill 的用途不匹配
  6. 设置了 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 编程时代。

免责声明

本网站新闻资讯均来自公开渠道,力求准确但不保证绝对无误,内容观点仅代表作者本人,与本站无关。若涉及侵权,请联系我们处理。本站保留对声明的修改权,最终解释权归本站所有。

相关阅读

更多
欢迎回来 登录或注册后,可保存提示词和历史记录
登录后可同步收藏、历史记录和常用模板
注册即表示同意服务条款与隐私政策