Claude Code 通关手册（七）：打造 AI 自动化流水线——Hooks、Skills、Plugins 实战
这是「Claude Code 通关手册」系列的第 7 篇，共 10 篇。Level 3（扩展篇）收官之作。这篇讲完，你就拥有了一套完整的 Claude Code 自动化体系。
到目前为止，你已经有了一个相当强的 Claude Code 配置：
- 子代理（第 5 篇）= 你的"AI 专家团"
- MCP（第 6 篇）= 专家团的"信息通道"
但有一个问题——所有操作都需要你主动触发。你说一句，Claude 做一步。你忘了说"跑一下 lint"，它就不跑。你忘了说"查一下类型"，它就不查。
今天要解决的就是这个问题。
Hooks = 流水线上的自动触发器。Claude 每次写完代码自动跑 Prettier，每次执行危险命令前自动拦截，每次会话结束自动记录日志——你设定好规则，剩下的全自动。
Skills = 可复用的专业知识包。Claude 根据任务自动加载对应的技能——写组件时加载前端规范，写 API 时加载后端规范，不需要你手动指定。
Plugins = 一键分发的工具箱。把 Commands + Agents + Skills + Hooks + MCP 打包成一个可安装的插件，团队里的每个人 /plugin install 一秒搞定。
三个系统各解决一个问题，组合起来就是一条全自动的 AI 开发流水线。
一、Hooks 系统——在 Claude 的每一步插入自动化
什么是 Hooks？
一句话：Hooks 是你预先定义的脚本，在 Claude 操作的特定时刻自动执行。
打个比方：工厂流水线上有很多"质检工位"——产品经过某个环节后自动进行质检，不合格的自动拦下。Hooks 就是 Claude Code 流水线上的质检工位。
关键词是确定性。你在 CLAUDE.md 里写"每次修改文件后请跑 lint"，这是一个"请求"——Claude 可能执行，也可能忘了。但 Hook 是保证执行——只要事件触发，脚本一定跑，没有例外。
生命周期事件全景
Claude Code 目前支持 14 个生命周期事件。日常最常用的是这几个：
code┌──────────────────────────────────────────────────────────┐
│ Hooks 生命周期（精选高频事件） │
├──────────────────────────────────────────────────────────┤
│ │
│ SessionStart │
│ → 会话启动时触发 │
│ → 适合：加载环境变量、注入开发上下文 │
│ ↓ │
│ UserPromptSubmit │
│ → 用户提交提示词时触发 │
│ → 适合：校验输入、注入额外上下文 │
│ ↓ │
│ PreToolUse │
│ → Claude 准备执行操作前触发 │
│ → 适合：拦截危险命令、修改操作参数 │
│ → matcher 过滤：Bash / Edit / Write / Read 等 │
│ ↓ │
│ [Claude 执行操作] │
│ ↓ │
│ PostToolUse │
│ → 操作完成后触发 │
│ → 适合：自动格式化、运行 lint、记录日志 │
│ → matcher 过滤：同上 │
│ ↓ │
│ Stop │
│ → Claude 完成回答时触发 │
│ → 适合：收尾操作、发送通知 │
│ │
│ 其他事件： │
│ PermissionRequest — 权限弹窗时触发（可自动放行/拦截） │
│ SubagentStop — 子代理完成时触发 │
│ PostToolUseFailure — 工具执行失败时触发 │
│ Notification — 通知事件（适合发桌面提醒） │
│ │
└──────────────────────────────────────────────────────────┘三种 Hook 类型
code┌──────────────────────────────────────────────────────────┐
│ 三种 Hook 处理器 │
├──────────┬──────────────────┬────────────────────────────┤
│ 类型 │ 工作方式 │ 适合场景 │
├──────────┼──────────────────┼────────────────────────────┤
│ command │ 执行 bash 命令 │ 确定性操作：格式化、lint、 │
│ │ （最常用） │ 日志记录、文件校验 │
├──────────┼──────────────────┼────────────────────────────┤
│ prompt │ 调用 LLM 评估 │ 需要智能判断：代码质量评估、 │
│ │ │ 安全风险分析 │
├──────────┼──────────────────┼────────────────────────────┤
│ agent │ 启动子代理处理 │ 复杂任务：全面审查、 │
│ │ │ 多维度分析 │
└──────────┴──────────────────┴────────────────────────────┘日常开发 90% 的场景用 command 类型就够了——执行一个 bash 命令，简单、快速、确定性强。
配置位置
Hooks 配置在 settings.json 中（跟第 2 篇的权限配置是同一个文件体系）：
~/.claude/settings.json——全局（所有项目生效）.claude/settings.json——项目级（提交到 Git）.claude/settings.local.json——个人本地（不提交）
也可以在交互模式中用 /hooks 命令可视化编辑。
实操：3 个最实用的 Hook
Hook 1：代码修改后自动格式化
这是使用频率最高的 Hook——Claude 每次写入或编辑文件后，自动跑 Prettier 格式化。
在 .claude/settings.json 中添加：
json{
"hooks": {
"PostToolUse": [
{
"matcher": "Write|Edit|MultiEdit",
"hooks": [
{
"type": "command",
"command": "jq -r '.tool_input.file_path' | xargs npx prettier --write 2>/dev/null; exit 0"
}
]
}
]
}
}解读一下这段配置：
- 事件：
PostToolUse——工具执行完成后 - matcher：
Write|Edit|MultiEdit——只在文件写入或编辑操作后触发（正则语法） - 命令：从 stdin 接收 JSON 输入，提取文件路径，然后对该文件跑 Prettier
exit 0：确保即使 Prettier 报错也不会阻塞 Claude 的流程
效果：从此 Claude 写的每一行代码都自动遵循你的 Prettier 配置，不用你在 CLAUDE.md 里写"请遵循代码格式"，也不用你手动跑 prettier --write。
如果你只想格式化特定类型的文件（比如只格式化 TypeScript），可以在命令中加个判断：
json{
"type": "command",
"command": "jq -r '.tool_input.file_path' | { read f; echo \"$f\" | grep -qE '\\.(ts|tsx)$' && npx prettier --write \"$f\"; exit 0; }"
}Hook 2：危险命令拦截
这个 Hook 在 Claude 执行 bash 命令之前检查，如果是危险命令就直接拦截：
json{
"hooks": {
"PreToolUse": [
{
"matcher": "Bash",
"hooks": [
{
"type": "command",
"command": "python3 -c \"import json,sys; d=json.load(sys.stdin); cmd=d.get('tool_input',{}).get('command',''); blocked=['rm -rf /','DROP TABLE','DROP DATABASE',':(){:|:&};:']; sys.exit(2) if any(b in cmd for b in blocked) else sys.exit(0)\""
}
]
}
]
}
}关键知识点：
- 事件：
PreToolUse——工具执行之前（可以拦截） - exit code 2：表示"拒绝执行"，Claude 会收到拒绝原因
- exit code 0：表示"放行"
这是你的最后一道安全防线——即使权限配置有遗漏，这个 Hook 也能兜底拦住破坏性命令。
Hook 3：敏感文件保护
防止 Claude 修改不该碰的文件：
json{
"hooks": {
"PreToolUse": [
{
"matcher": "Edit|Write|MultiEdit",
"hooks": [
{
"type": "command",
"command": "python3 -c \"import json,sys; d=json.load(sys.stdin); p=d.get('tool_input',{}).get('file_path',''); sys.exit(2 if any(x in p for x in ['.env','package-lock.json','.git/','prisma/migrations/']) else 0)\""
}
]
}
]
}
}这个 Hook 阻止 Claude 修改 .env、package-lock.json、.git/ 目录和 Prisma 迁移文件。这些文件要么包含敏感信息，要么由工具自动生成，不应该被 AI 手动修改。
DevPulse 完整 Hooks 配置
把三个 Hook 组合起来，这是 DevPulse 项目的完整配置：
json{
"permissions": {
"...": "（第2篇配置的权限，此处省略）"
},
"hooks": {
"PreToolUse": [
{
"matcher": "Bash",
"hooks": [
{
"type": "command",
"command": "python3 -c \"import json,sys; d=json.load(sys.stdin); cmd=d.get('tool_input',{}).get('command',''); blocked=['rm -rf /','DROP TABLE','DROP DATABASE']; sys.exit(2) if any(b in cmd for b in blocked) else sys.exit(0)\""
}
]
},
{
"matcher": "Edit|Write|MultiEdit",
"hooks": [
{
"type": "command",
"command": "python3 -c \"import json,sys; d=json.load(sys.stdin); p=d.get('tool_input',{}).get('file_path',''); sys.exit(2 if any(x in p for x in ['.env','package-lock.json','.git/']) else 0)\""
}
]
}
],
"PostToolUse": [
{
"matcher": "Write|Edit|MultiEdit",
"hooks": [
{
"type": "command",
"command": "jq -r '.tool_input.file_path' | xargs npx prettier --write 2>/dev/null; exit 0"
}
]
}
]
}
}三层防护：操作前拦截危险命令 → 操作前保护敏感文件 → 操作后自动格式化。
二、Skills 系统——Claude 的"技能库"
跟 Slash 命令有什么区别？
第 4 篇讲了 Slash 命令（.claude/commands/），Skills 看起来也是 Markdown 文件，也有 frontmatter——它们有什么区别？
code┌──────────────────────────────────────────────────────────┐
│ Slash Commands vs Skills │
├──────────────────┬───────────────────────────────────────┤
│ Slash Commands │ Skills │
├──────────────────┼───────────────────────────────────────┤
│ 你主动调用 │ Claude 根据任务自动加载 │
│ /review file.ts │ 你说"写个组件"→ 自动加载前端规范 │
├──────────────────┼───────────────────────────────────────┤
│ 简单的提示词模板 │ 可包含脚本、模板、参考文档 │
├──────────────────┼───────────────────────────────────────┤
│ 单个 .md 文件 │ 一个目录（SKILL.md + 附属文件） │
├──────────────────┼───────────────────────────────────────┤
│ 适合：固定操作 │ 适合：需要上下文感知的专业知识 │
│ "每次审查用这个" │ "写前端时自动知道我们的规范" │
├──────────────────┼───────────────────────────────────────┤
│ 位置： │ 位置： │
│ .claude/commands/ │ .claude/skills/ │
│ ~/.claude/ │ ~/.claude/skills/ │
│ commands/ │ │
└──────────────────┴───────────────────────────────────────┘
简单记忆：
Commands = 你说"做这个" → Claude 执行（主动触发）
Skills = Claude 看到任务 → 自动调取对应技能（被动匹配）Skills 使用渐进式披露策略加载——Claude 启动时只读取每个 Skill 的名称和描述（约 30-50 Token），发现当前任务匹配某个 Skill 时才加载完整内容。所以你可以安装很多 Skill 而不用担心上下文爆炸。
创建一个 Skill：前端代码规范
bashmkdir -p .claude/skills/frontend-standards创建 .claude/skills/frontend-standards/SKILL.md：
markdown---
name: frontend-standards
description: DevPulse 前端代码规范和最佳实践。在编写 React 组件、样式、状态管理和数据获取时自动加载。
---
# DevPulse 前端开发规范
## 组件规范
- 使用 function 关键字声明组件，不用箭头函数导出
- Props 接口命名：ComponentNameProps
- 默认是 Server Component，需要交互时才加 'use client'
- 组件超过 150 行必须拆分
## 样式规范
- 使用 Tailwind CSS 工具类
- 超过 5 个类名用 cn() 函数合并
- 响应式优先：mobile-first 设计
- 暗色模式使用 dark: 前缀
## 数据获取
- Server Component 中直接 async/await 获取数据
- Client Component 中使用 SWR 或 React Query
- API 调用统一走 /api/ 路由
## 性能清单
- 图片必须使用 next/image
- 列表必须有稳定 key（不用 index）
- 大列表使用虚拟滚动
- 路由切换使用 next/link 预加载
## 错误处理
- 每个页面必须有 error.tsx 边界
- 加载状态使用 loading.tsx 或 Suspense
- API 错误统一格式：{ error: string, code: string }现在当你让 Claude "写一个 ArticleCard 组件"时，它会自动匹配这个 Skill 的描述（"编写 React 组件"），加载完整规范，然后按照你定义的标准来写代码。你什么都不用说，它自动就知道用 function 声明、Props 命名为 ArticleCardProps、默认 Server Component。
Skill 还能打包脚本
Skills 比 Commands 强大的地方之一是可以附带脚本文件。比如一个代码可视化 Skill：
code.claude/skills/codebase-visualizer/
├── SKILL.md ← 指令和描述
├── visualize.sh ← 生成可视化的脚本
└── template.html ← 输出模板Claude 执行 Skill 时可以调用目录中的脚本，产出比纯文本更丰富的结果。
三、Plugins 系统——团队级的标准化工具箱
Plugin 是什么？
如果说 Commands、Agents、Skills、Hooks、MCP 是各种零散的"零件"，那 Plugin 就是把这些零件打包成一个可安装的"工具箱"。
一个 Plugin 的结构：
codemy-plugin/
├── .claude-plugin/
│ └── plugin.json ← 插件元数据（名称、版本、描述）
├── commands/ ← Slash 命令
├── agents/ ← 子代理
├── skills/ ← 技能包
├── hooks.json ← Hooks 配置
├── .mcp.json ← MCP Server 配置
└── README.md ← 文档使用场景：你是团队的技术负责人，你花了几天时间配好了一整套 Claude Code 工作流——审查命令、测试子代理、安全 Hook、前端规范 Skill。现在团队里来了个新人，你让他搞一套同样的配置？
不用。把你的配置打包成 Plugin，新人只需要：
bash/plugin install your-team-plugin@your-marketplace
一条命令，所有人的 Claude Code 环境就统一了。
基本操作
bash# 安装插件
/plugin install plugin-name@marketplace-name
# 查看已安装的插件
/plugin list
# 启用/禁用（不删除，只是开关）
/plugin enable plugin-name@marketplace-name
/plugin disable plugin-name@marketplace-name
# 开发时加载本地插件（调试用）
claude --plugin-dir ./my-plugin实用的社区 Plugin
社区已经有不少现成的 Plugin 可以直接用：
- code-review：自动化 PR 审查，5 个并行子代理分别检查不同维度
- security-scanner：PreToolUse Hook 监控 9 种安全模式
- python3-development：Python 开发全套——15+ 命令、17 个子代理、TDD 工作流
对于大多数个人开发者来说，你可能暂时不需要创建自己的 Plugin。但了解它的存在很重要——当你的 Claude Code 配置足够成熟，可以分享给团队或社区时，Plugin 就是分发的最佳方式。
四、综合实战：四个系统协同工作
现在让我们看看这些系统组合起来是什么效果。以 DevPulse 项目为例，一个完整的自动化工作流：
code┌──────────────────────────────────────────────────────────┐
│ DevPulse 全自动开发工作流 │
├──────────────────────────────────────────────────────────┤
│ │
│ 你: "修复 GitHub 上那个暗色模式闪屏的 issue" │
│ ↓ │
│ ① [MCP - GitHub] │
│ 自动搜索 issues → 找到 #49 │
│ 读取 issue 详情和评论中的复现步骤 │
│ ↓ │
│ ② [Skill - frontend-standards] │
│ Claude 准备修改组件 → 自动加载前端规范 │
│ 知道要用 function 声明、Tailwind 样式、 │
│ Server Component 优先 │
│ ↓ │
│ ③ [Claude 修改 ThemeProvider.tsx] │
│ ↓ │
│ ④ [Hook - PostToolUse] │
│ 文件修改完成 → 自动跑 Prettier 格式化 │
│ （你什么都不用说，自动执行） │
│ ↓ │
│ ⑤ [子代理 - code-reviewer] │
│ 你说"审查一下改动" → │
│ 独立上下文窗口中深度审查 │
│ ↓ │
│ ⑥ [MCP - GitHub] │
│ 创建 PR → 关联 #49 → 自动填写描述 │
│ │
│ 整个过程： │
│ MCP 提供外部信息 → Skill 提供专业规范 → │
│ Hook 保证代码质量 → 子代理提供深度审查 │
│ 四个系统各司其职，无缝协作 │
│ │
└──────────────────────────────────────────────────────────┘这就是"AI 自动化流水线"的完整形态。你只说了一句话，四个系统自动接力完成了整个工作流。
五、扩展体系总览：一张图看清所有"积木"
整个 Level 3 讲了很多概念，这里用一张图总结它们之间的关系：
code┌──────────────────────────────────────────────────────────┐
│ Claude Code 扩展体系总览 │
├──────────────────────────────────────────────────────────┤
│ │
│ ┌─────────┐ ┌──────────┐ ┌─────────┐ ┌──────────┐ │
│ │ Commands │ │ Agents │ │ Skills │ │ Hooks │ │
│ │ 快捷命令 │ │ 子代理 │ │ 技能包 │ │ 自动触发 │ │
│ │ 你主动调 │ │ 专家分工 │ │ 自动匹配│ │ 确定性 │ │
│ │ 用 │ │ 独立上下文│ │ 渐进加载│ │ 执行 │ │
│ └────┬─────┘ └────┬─────┘ └────┬────┘ └────┬─────┘ │
│ │ │ │ │ │
│ └──────┬──────┴──────┬──────┘ │ │
│ ↓ ↓ │ │
│ ┌──────────────────────────┐ │ │
│ │ MCP Servers │ │ │
│ │ 外部工具连接（GitHub、 │ │ │
│ │ 数据库、文档查询等） │ │ │
│ └──────────────────────────┘ │ │
│ │ │
│ ┌──────────────────────────────────────────┘ │
│ ↓ │
│ ┌──────────────────────────────────────────────┐ │
│ │ Plugin（打包分发） │ │
│ │ = Commands + Agents + Skills + Hooks + MCP │ │
│ │ 一键安装，团队统一 │ │
│ └──────────────────────────────────────────────┘ │
│ │
│ 选择指南： │
│ "我要重复执行某个操作" → Command │
│ "我要专业分工和并行" → Agent │
│ "我要自动加载知识" → Skill │
│ "我要在每一步自动执行" → Hook │
│ "我要连接外部工具" → MCP │
│ "我要打包分发给团队" → Plugin │
│ │
└──────────────────────────────────────────────────────────┘本篇小结
三个核心收获：
第一，Hooks 给你确定性控制——PostToolUse 自动格式化、PreToolUse 拦截危险操作、保护敏感文件。从"请求 Claude 做"变成"保证每次都做"。配置在 settings.json 的 hooks 字段中，用 matcher 正则匹配目标工具。
第二，Skills 是可自动匹配的知识包——Claude 根据任务描述自动加载对应的 Skill，不用你手动指定。渐进式加载机制让你可以安装很多 Skill 而不影响性能。跟 Commands 的核心区别是：Commands 你主动调用，Skills Claude 自动选用。
第三，Plugin 是终极打包方案——把 Commands + Agents + Skills + Hooks + MCP 打成一个可安装的包，团队统一标准只需要一条 /plugin install 命令。
Level 3 通关检查清单
回顾 Level 3（扩展篇）三篇文章的完整检查清单：
- 创建了至少 2 个子代理（code-reviewer + test-writer）
- 安装了 GitHub MCP 和 Context7 MCP
- 配置了 PostToolUse Hook 自动格式化代码
- 配置了 PreToolUse Hook 拦截危险命令
- 创建了至少 1 个自定义 Skill
- 理解 Commands / Agents / Skills / Hooks / MCP / Plugins 各自的定位
- 知道 /hooks 和 /plugin 命令的用法
全部打勾？恭喜，Level 3 通关。你的 Claude Code 已经从"一个 AI 助手"进化成了一套完整的 AI 自动化开发平台。
下篇预告
第 8 篇：Claude Code 通关手册（八）—— Headless 模式 + SDK：用代码指挥 AI
从下一篇开始进入 Level 4（高级篇），面向想要把 Claude Code 集成到自动化流程中的开发者。
到目前为止，你一直在终端里跟 Claude 对话。但如果你想把 Claude Code 嵌入到 CI/CD 流水线里呢？比如每次有人提 PR，自动触发 Claude 做代码审查？或者批量处理 100 个文件的重构？
这就需要 Headless 模式（无交互运行）和 Agent SDK（用代码调用 Claude Code）。下一篇，带你解锁这个能力。
今日话题
你最想自动化的开发操作是什么？每次 commit 前自动跑测试？每次写完代码自动格式化？还是更有创意的用法？评论区分享你的自动化愿望——说不定 Hooks 就能帮你实现。
如果这篇文章帮你理清了 Claude Code 扩展体系的全貌，欢迎点赞、在看、转发三连——Level 3 收官之作，值得让更多人看到。
关注「前端达人」，Level 4 高级篇即将开启，我们下篇见。
如果这篇对你有帮助，欢迎关注公众号「前端达人」，每周更新实用前端干货。
