Claude Code Skills 国内实践全指南：从安装部署到高阶开发

#Anthropic官方Skills库：https://github.com/anthropics/skills
#Skills 官方介绍（What are Skills）：https://support.claude.com/en/articles/12512176-what-are-skills#Claude Code Skills 文档：https://code.claude.com/docs/en/skills#Claude API Skills 指南：https://platform.claude.com/docs/en/build-with-claude/skills-guide#Skill Creator：https://github.com/anthropics/skills/blob/main/skills/skill-creator/SKILL.md#Agent Skills 背景/机制：https://www.anthropic.com/engineering/equipping-agents-for-the-real-world-with-agent-skills

#Skills 总览：https://developers.openai.com/codex/skills/#创建自定义 Skills：https://developers.openai.com/codex/skills/create-skill/#ChatGPT 环境的 /home/oai/skills（社区实测打包仓）https://github.com/eliasjudin/oai-skills

https://github.com/obra/superpowers#skills目录https://github.com/obra/superpowers/tree/main/skills

https://github.com/ComposioHQ/awesome-claude-skills

https://github.com/VoltAgent/awesome-claude-skills

https://github.com/travisvn/awesome-claude-skills

https://github.com/BehiSecc/awesome-claude-skills

https://skillsmp.com/

https://claudemarketplaces.com/

https://www.aitmpl.com/skillshttps://github.com/davila7/claude-code-templates

https://github.com/ruvnet/claude-flow

https://github.com/wshobson/agents

/plugin marketplace add wshobson/agents

/plugin install sql-optimization-patterns

blob:https://skillsmp.com/1dfeae32-c71d-4740-bab6-26f46b848134

claude

/plugin

/plugin marketplace add wshobson/agents

#克隆skill项目到本地git clone https://github.com/davila7/claude-code-templates.git

一个优秀的SKILL不是一段对话提示，而是一个迷你产品。SKILL的KPI只有一个：可以一次跑通并验收结果。

---name: api-interface-generatordescription: 根据后端Controller代码，自动生成前端TypeScript接口定义与Axios请求函数。version: 1.0.0author: your-nametags:  - typescript  - api  - code-generation---# Goal- **输出物**：一个标准的TypeScript文件（`api.ts`），包含：  1.  所有接口的请求/响应类型定义（TypeScript Interfaces）。  2.  对应每个接口的、已配置基础的Axios请求函数。- **可验证**：生成的代码应能通过TypeScript编译（`tsc --noEmit`检查）。# Inputs- **必填**：  1.  `controller_path`: 后端Controller源代码的文件路径或直接粘贴的代码。  2.  `api_base_url`: 后端API的基础URL（例如：`https://api.example.com/v1`）。- **可选**：  1.  `auth_type`: 认证方式，默认为 `'bearer'`（可选：`basic`, `none`）。# Constraints- **不做什么**：  - 不修改任何后端源代码。  - 不生成除TypeScript类型和请求函数之外的任何框架特定代码（如React Hooks）。- **质量与边界**：  - 所有生成的函数必须包含完整的JSDoc注释，说明用途和参数。  - 必须处理常见的HTTP状态码错误（401，403，500）。  - 生成的接口名必须遵循 `I{ControllerName}{MethodName}{Request/Response}` 的帕斯卡命名规范。# Steps技能将按以下顺序自动执行：1.  **解析与分析**：    - 读取或解析输入的Controller代码。    - 识别出所有的公开方法、HTTP方法（GET/POST等）、请求路径、请求参数和返回类型。2.  **转换与生成**：    - 将识别的后端类型映射为TypeScript类型（如`String` -> `string`, `List<User>` -> `IUser[]`）。    - 为每个API端点生成：一个请求类型、一个响应类型、一个Axios请求函数。3.  **组装与输出**：    - 将生成的代码按以下结构组装到`api.ts`文件中：      ```typescript      // 1. 导入声明      import axios from 'axios';      // 2. 所有类型定义      export interface ILoginRequest { ... }      // 3. 所有请求函数      export const loginApi = ( ... ) => { ... }      ```    - 在文件头部自动生成基于当前时间的生成注释。# Verification Checklist在技能执行完成后，请对照此清单检查输出：- [ ] **完整性**：Controller中每个公开方法都生成了对应的请求函数。- [ ] **正确性**：生成的TypeScript代码无语法错误，可通过`tsc --noEmit`检查。- [ ] **实用性**：每个请求函数都正确配置了`method`、`url`、`params/data`。- [ ] **安全性**：认证令牌（`auth_type`）被正确集成到请求头配置中。- [ ] **文档化**：每个函数和接口都有清晰的JSDoc注释。# Advanced: MCP工具集成 (可选)如果技能需要访问外部资源（如读取文件、调用Git），可以声明MCP工具：```yaml# 在SKILL.md同级目录创建 skill.yamltools:  - name: read_file    description: 读取本地文件内容  - name: list_directory    description: 列出目录内容

~/.claude/skills/                    # 技能根目录└── api-interface-generator/        # 【必须】为技能创建的文件夹    └── SKILL.md                     # 【必须】技能主文件，必须叫此名

// UserController.java - 用于技能测试package com.example.demo.controller;import org.springframework.web.bind.annotation.*;import java.util.List;@RestController@RequestMapping("/api/v1/users")public class UserController {
    /**     * 用户登录     * @param request 登录请求     * @return 登录响应（含令牌）     */    @PostMapping("/login")    public ApiResponse<LoginResponse> login(@RequestBody LoginRequest request) {        // 实现逻辑...        return ApiResponse.success(new LoginResponse());    }
    /**     * 获取用户列表（分页）     * @param page 页码     * @param size 每页大小     * @return 用户列表     */    @GetMapping("")    public ApiResponse<PageResult<UserDto>> getUsers(            @RequestParam(defaultValue = "1") int page,            @RequestParam(defaultValue = "20") int size) {        // 实现逻辑...        return ApiResponse.success(new PageResult<>());    }
    /**     * 更新用户信息     * @param id 用户ID     * @param user 用户数据     * @return 更新结果     */    @PutMapping("/{id}")    public ApiResponse<UserDto> updateUser(            @PathVariable Long id,            @RequestBody UpdateUserRequest user) {        // 实现逻辑...        return ApiResponse.success(new UserDto());    }
    // 内部DTO定义（技能需要识别这些类型）    public static class LoginRequest {        private String username;        private String password;        // getters/setters...    }
    public static class LoginResponse {        private String token;        private UserDto user;        // getters/setters...    }
    public static class UpdateUserRequest {        private String nickname;        private String avatar;        // getters/setters...    }}

请使用 api-interface-generator 技能，基于当前目录下的 UserController.java 文件，生成前端TypeScript API代码，API基础URL设为 https://api.myxxx.com/v1

// Generated by API Interface Generator on 2026-01-08import axios, { AxiosInstance } from 'axios';// Base API configurationconst API_BASE_URL = 'https://api.myxxx.com/v1';const apiClient = axios.create({  baseURL: API_BASE_URL,  headers: {    'Content-Type': 'application/json',    // Authorization header will be added dynamically for protected endpoints  }});// Error handling interceptorapiClient.interceptors.response.use(  (response) => response,  (error) => {    if (error.response?.status === 401) {      throw new Error('Unauthorized: Please login again');    }    if (error.response?.status === 403) {      throw new Error('Forbidden: You do not have permission');    }    if (error.response?.status === 500) {      throw new Error('Internal server error');    }    throw error;  });// Request type definitionsexport interface ILoginRequest {  username: string;  password: string;}export interface ILoginResponse {  token: string;  user: IUserDto;}export interface IUserDto {  nickname?: string;  avatar?: string;}export interface IUpdateUserRequest {  nickname?: string;  avatar?: string;}export interface IApiResponse<T> {  success: boolean;  data?: T;  message?: string;}export interface IPageResult<T> {  list: T[];  total: number;  page: number;  size: number;}// API request functions/** * 用户登录 * @param request 登录请求体，包含用户名和密码 * @returns 返回登录响应，包含访问令牌和用户信息 */export const loginApi = async (request: ILoginRequest): Promise<ApiResponse<ILoginResponse>> => {  const response = await apiClient.post<ApiResponse<ILoginResponse>>('/users/login', request);  return response.data;};/** * 获取用户列表（分页） * @param page 页码，默认为1 * @param size 每页大小，默认为20 * @returns 返回分页的用户列表数据 */export const getUsersApi = async (  page: number = 1,  size: number = 20): Promise<ApiResponse<PageResult<IUserDto>>> => {  const params = { page, size };  const response = await apiClient.get<ApiResponse<PageResult<IUserDto>>>('/users', { params });  return response.data;};/** * 更新用户信息 * @param id 用户ID * @param user 用户更新数据 * @returns 返回更新后的用户信息 */export const updateUserApi = async (  id: number,  user: IUpdateUserRequest): Promise<ApiResponse<IUserDto>> => {  const response = await apiClient.put<ApiResponse<IUserDto>>(`/users/${id}`, user);  return response.data;};// Helper function to set authorization tokenexport const setAuthToken = (token: string) => {  apiClient.defaults.headers.common['Authorization'] = `Bearer ${token}`;};// Helper function to clear authorization tokenexport const clearAuthToken = () => {  delete apiClient.defaults.headers.common['Authorization'];};// Legacy types for backwards compatibilitytype ApiResponse<T> = IApiResponse<T>;type PageResult<T> = IPageResult<T>;

# 方式1: 从已知仓库添加市场并安装/plugin marketplace add wshobson/agents/plugin install sql-optimization-patterns# 方式2: 手动安装（用于本地技能），正确目录结构：~/.claude/skills/your-skill-name/SKILL.md