1. 从一次「AI 又忘了规范」说起如果你已经在 Claude Code 里写过几轮代码大概率遇到过这种场景明明上次已经交代过「组件必须放src/components、样式用 CSS Modules、每个组件配一个测试文件」这次开新会话它又按自己的习惯生成了components/Button/index.tsx加内联样式。你只能把上次那段话再贴一遍贴完还得检查它有没有漏掉测试文件。这不是模型变笨了而是单次 Prompt 的天然缺陷它只活在当前上下文里会话一关就归零。你每次都在用「口头交代」的方式管理一个需要长期稳定的工程规范成本高、结果飘。AI Skills 技能系统要解决的就是这件事。Skill 本质上是给 AI 写的 SOP标准操作手册把「个人经验」沉淀成「项目资产」。它和单次 Prompt 的区别可以用一张表说清楚维度单次 PromptSkill使用方式每次临时写可复用按需加载输出稳定性依赖当次表达按固定流程执行维护方式用完即弃可版本管理团队共享不方便放进项目仓库即可这篇要落地的是完整链路用SKILL.md定义技能用 MCP 扩展能力边界再通过 TaoToken 统一 Key/API 通道把 Claude Code 接起来。适合已经在用 Claude Code、想让 AI 工作流稳定下来的开发者也适合刚接触 Skill 概念、想找一个能跑通的最小例子的人。下面所有配置都可以直接复制我会把每一步的验证动作和踩坑点都写出来。2. TaoToken 前置把 Key 和 API 通道准备好Claude Code 要跑起来绕不开两件事模型从哪来、Key 怎么管。TaoToken 在这里扮演的是统一通道的角色——一个 Key 覆盖多种模型调用Claude Code、Coding Plan、模型对话都走同一套凭证省得你在多个平台之间来回切换配置。先注册并拿到 API Key。打开官网 https://taotoken.net/?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content 注册后在控制台创建 Key。控制台地址是 https://taotoken.net/console?utm_sourcetaotoken_aicg_blog_endutm_contentconsoleutm_campaignrewrite Key 管理页在 https://taotoken.net/api-keys?utm_sourcetaotoken_aicg_blog_endutm_contentapi-keysutm_campaignrewrite 。创建时建议按用途命名比如claude-code-dev方便后面区分。API 的基础地址是https://taotoken.net/api注意这个地址不带任何查询参数配置时直接填这个。如果你要接的是 Anthropic 协议兼容的客户端Claude Code 就属于这类走的是 ClaudeCodeAnthropic 通道文档在 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_contentdocutm_campaignrewrite 。这里有个容易混的点官网首页带 UTM 参数是为了统计来源但 API 地址本身是干净的https://taotoken.net/api两者不要搞混。配置里填错成带参数的地址请求会直接失败。注意Key 属于敏感凭证不要提交进 Git 仓库。后面我会用环境变量的方式引用避免硬编码。3. 可复制配置settings.json 与 SKILL.md 骨架3.1 Claude Code 的 settings.jsonClaude Code 的配置分两层全局配置在用户目录项目配置在项目根目录的.claude/settings.json。团队协作场景建议用项目级配置这样每个人 pull 下来就是同一套。先看项目级settings.json的骨架{ env: { ANTHROPIC_BASE_URL: https://taotoken.net/api, ANTHROPIC_AUTH_TOKEN: ${TAOTOKEN_API_KEY}, ANTHROPIC_MODEL: claude-sonnet-4-5 }, permissions: { allow: [ Read, Glob, Grep, Edit, Bash(git diff:*), Bash(git status:*) ], deny: [ Bash(rm -rf:*), Bash(curl:*) ] } }几个关键点解释一下。ANTHROPIC_BASE_URL指向 TaoToken 的 API 地址ANTHROPIC_AUTH_TOKEN用${TAOTOKEN_API_KEY}引用环境变量实际值放在你的 shell 配置或.env里不进仓库。permissions里我把rm -rf和curl放进了 deny这是防止 Skill 或 MCP 被诱导执行危险命令的第一道闸。环境变量这样设置macOS/Linuxexport TAOTOKEN_API_KEYsk-你的实际KeyWindows PowerShell$env:TAOTOKEN_API_KEYsk-你的实际Key3.2 SKILL.md 的完整骨架Skill 的目录结构不一定要全套够用就好。一个带脚本和模板的完整结构长这样.claude/skills/react-component/ ├── SKILL.md ├── scripts/ │ └── validate.js ├── resources/ │ └── template/ │ └── component.tsx.tpl └── requirements.txtSKILL.md是核心说明书用 Frontmatter 声明元数据正文写触发条件、步骤和输出标准--- name: react-component-generator version: 1.0 description: 根据需求生成符合项目规范的 React 组件文件集 trigger: [创建组件, 新建React组件, 生成组件] tools: [typescript, react] --- # React 组件生成规范 ## 触发条件 当用户要求创建、新建或生成 React 组件时启用本 Skill。 ## 执行步骤 1. 确认组件名PascalCase、功能描述、Props 列表、状态需求。 2. 在 src/components/ComponentName/ 下生成文件。 3. 必须包含index.tsx、ComponentName.module.css、ComponentName.test.tsx。 4. 组件使用函数式写法Props 用 interface 定义并导出。 5. 生成后运行 node scripts/validate.js ComponentName 校验目录完整性。 ## 输出标准 - 文件路径必须匹配 src/components/ComponentName/。 - 样式一律走 CSS Modules禁止内联 style。 - 测试文件至少包含一个渲染用例。Frontmatter 的价值在于「渐进式披露」Agent 先读元数据只有任务匹配时才加载完整指令不把所有细节一次性塞进上下文。trigger写清楚AI 才知道什么时候该翻这本手册。3.3 注册到 CLAUDE.mdSkill 建好后要在CLAUDE.md里注册Claude Code 才会主动去读## 项目 Skills - .claude/skills/react-component/ - React 组件生成规范 - .claude/skills/git-commit/ - Git 提交规范 - .claude/skills/security-audit/ - 代码安全审计 执行相关任务时请先阅读对应 Skill 目录下的 SKILL.md 并严格遵循。4. MCP 服务注册与技能调用验证4.1 注册一个 MCP 服务Skill 规定「怎么做」MCP 扩展「能做什么」。比如你想让 Claude Code 能读 GitHub 的 PR 和 CI 日志就需要注册 GitHub MCP。在项目根目录创建.mcp.json{ mcpServers: { github: { command: npx, args: [-y, modelcontextprotocol/server-github], env: { GITHUB_PERSONAL_ACCESS_TOKEN: ${GITHUB_TOKEN} } } } }注册后重启 Claude Code用/mcp命令查看服务状态。正常的话会列出github及其可用工具。这里同样用环境变量引用 Token别写死。4.2 一次完整的技能调用配置就绪后在 Claude Code 里输入帮我创建一个 UserCard 组件接收 name、avatar、role 三个 Props预期行为是Claude Code 读到CLAUDE.md里的 Skill 注册信息匹配到react-component-generator的 trigger加载SKILL.md然后按步骤生成三个文件。生成完它会调用scripts/validate.js做校验。validate.js可以写得简单直接const fs require(fs); const path require(path); const name process.argv[2]; const dir path.join(src, components, name); const required [index.tsx, ${name}.module.css, ${name}.test.tsx]; let ok true; for (const f of required) { if (!fs.existsSync(path.join(dir, f))) { console.error(缺失文件: ${f}); ok false; } } console.log(ok ? 校验通过 : 校验失败); process.exit(ok ? 0 : 1);4.3 验证请求是否真的走通了想确认请求确实经过 TaoToken 通道可以在 Claude Code 里跑一个最小任务然后去控制台看调用记录。控制台地址 https://taotoken.net/console?utm_sourcetaotoken_aicg_blog_endutm_contentconsoleutm_campaignrewrite 能看到每次请求的模型、token 消耗和时间戳。如果记录为空说明配置没生效回到第 5 节排查。如果你只是想先验证模型通道是否正常不涉及 Skill可以直接用模型对话页面 https://taotoken.net/?utm_sourcetaotoken_aicg_blog_endutm_contentmodel-chatutm_campaignrewrite 发一条测试消息确认 Key 有效。5. 本篇常见错排查配置跑不通八成是下面几个原因。我按出现频率排一下。报错一401 Unauthorized最常见。检查三处环境变量TAOTOKEN_API_KEY是否真的导出到了当前 shellecho $TAOTOKEN_API_KEY验证settings.json里引用写法是否是${TAOTOKEN_API_KEY}Key 是否在控制台被禁用或删除。如果 Key 刚创建等几秒再试有时有同步延迟。报错二Connection error或请求超时先确认ANTHROPIC_BASE_URL填的是https://taotoken.net/api不带任何路径后缀和查询参数。填成https://taotoken.net/api/v1之类的会 404。另外检查本地网络是否能正常访问该地址。报错三Skill 不生效AI 没读 SKILL.md三个检查点CLAUDE.md里的路径是否和实际目录一致大小写敏感SKILL.md的 Frontmatter 格式是否正确---必须是文件第一行trigger关键词是否覆盖了你实际说的话。如果 trigger 写的是「创建组件」而你输入的是「生成一个组件」可能匹配不上把 trigger 写宽一点。报错四MCP 服务启动失败/mcp里显示 failed 的话先手动在终端跑一遍npx -y modelcontextprotocol/server-github看是不是包下载或 Token 问题。GITHUB_TOKEN没设置会直接启动失败。另外 MCP 服务改动后必须重启 Claude Code热更新不生效。报错五Skill 里的脚本执行被权限拦截如果你在settings.json的 deny 里加了Bash(node:*)那validate.js就跑不起来。把需要的命令加进 allow 列表比如Bash(node scripts/validate.js:*)。权限配置是白名单加黑名单的组合deny 优先级更高。提示排查时把 Claude Code 的日志级别调高能看到具体的请求 URL 和响应码比猜快得多。6. 把 Skill 沉淀成团队资产Skill 不是写完就一劳永逸的。每次用完花两分钟复盘哪些步骤 AI 执行得好就保留哪些地方它反复出错就把步骤写得更明确哪些边界情况漏了就补进错误处理。输出格式不稳定就加一个示例文件到resources/。用 Git 管理 Skill 目录团队 pull 下来就是同一套工作流git add .claude/skills/react-component/ git commit -m feat(skills): 新增 React 组件生成 Skill v1.0如果你打算长期在项目里跑 Claude Code 加 Skill 加 MCP 这套组合Coding Plan 会比按量调用更划算入口在 https://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_contentcoding-planutm_campaignrewrite 。接入过程中遇到 Key 或通道问题先翻接入文档 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_contentdocutm_campaignrewrite 大部分配置细节那里都有。最后留一个我自己的习惯每新增一个 Skill先在scripts/里放一个能独立运行的校验脚本。这样即使 AI 生成的产物有问题你也能在提交前用脚本卡一道而不是靠肉眼检查。Skill 的价值不在于目录多复杂而在于任务标准是否清楚、触发条件是否明确、输出是否稳定——这三点做到了一个只有SKILL.md的极简 Skill 也比一堆花架子管用。