HumanLayer Skills Skill：让 Claude Code 拥有专业工程判断的技能扩展集

Skill超级捕获手 技术创作者 2026-09-08 10 阅读

让 Claude Code 拥有专业领域技能的扩展技能集。HumanLayer Skills 包含 5 个开箱即用的垂直场景技能——优化 CLAUDE.md 指令质量、收窄 React Props 类型、构建迭代式 Agent 循环、访谈式设计控制回路、用可视化解释代码——将工程判断编码为可移植的 Agent 指令，解决 AI 编码助手”输出通用、缺乏工程深度”的核心痛点。

功能与原则

HumanLayer Skills 的核心理念是：让 AI 在特定垂直场景下具备经过验证的最佳实践，而不是每次都从零开始。它不提供运行时框架或 SDK，而是将工程判断编码为纯指令文件（SKILL.md），通过 Claude Code 的斜杠命令接口注入当前对话。

项目包含 5 个独立技能，每个做一件事：

  • improve-claude-md：用条件块（# IMPORTANT if）重构 CLAUDE.md，减少规则噪音、提升指令遵循率
  • narrow-react-prop-types：将 React 组件 Props 类型收窄到实际代码路径，而非 Storybook / test / mock 状态
  • build-iterated-agentic-loop：构建本地技能 + 迭代式 Agent 循环，含 GitHub Actions workflow、记忆文件和参考模板
  • design-control-loop：访谈式设计 Agentic 控制回路（sensor → controller → actuator → disturbances），再本地构建运行
  • show-me：用图表、代码形状草图、聚焦 HTML artifact 解释当前话题

认可度

  • GitHub stars：约 3,436（截至 2026-09-08）
  • GitHub forks：约 100
  • 最近动态：2026-08-13 推送，2026 年 9 月初出现在 GitHub Trending 周榜，单日增长 +451 stars
  • 社媒讨论：2026-09-05 多篇中文技术博客集中报道，被列入”2026 年 9 月 Agent Skills 必知榜”
  • Trending 经历：2026 年 9 月第一周进入 GitHub Trending AI Agent 类目

链接

GitHub：https://github.com/humanlayer/skills

原作者

HumanLayer——专注于 AI Agent 基础设施的开源团队，核心成员在 GitHub username 为 sbepstein（HumanLayer SDK 作者）和 kam-hak（humanlayer 主仓库维护者）。HumanLayer 团队的口号是”让 AI Agent 在高风险工具调用时必须经过人工审批”，skills 仓库是其技能生态的核心部分。

介绍

传统的 AI 编码助手在工作流层面缺乏工程深度。Claude Code 虽然能生成代码，但对特定垂直场景的指令遵循质量取决于 CLAUDE.md 的编写水平——而大多数人的 CLAUDE.md 是静态的，规则堆砌，没有条件触发机制，导致指令噪音大、AI 忽略关键约束。

HumanLayer Skills 的解决思路是把”工程判断”封装成可注入的技能片段。以 improve-claude-md 为例，它不是教你如何写 CLAUDE.md，而是直接用 Claude Code 自己的条件块机制（# IMPORTANT if）重写 CLAUDE.md，让规则只在特定任务类型下激活。这是Meta-level 的操作——用 AI 优化 AI 的上下文注入逻辑。

narrow-react-prop-types 解决的是另一个真实问题：AI 生成的 React 组件往往使用过于宽泛的 Props 类型（如 React.FC<any> 或 object），这些类型在 Storybook 或测试环境能跑，但对接真实业务代码时会类型错误。技能通过分析实际代码路径，将 Props 类型收窄到运行时真实需要的形状。

build-iterated-agentic-loop 和 design-control-loop 则面向更复杂的 Agentic 场景：如何把一个临时 AI 任务变成可复用的本地技能 + 定时 Agent 循环？这不是简单脚本，而是包含 GitHub Actions workflow、记忆文件、reference templates 的完整套件。

show-me 是其中最独特的一个：它让 AI 用图表和 HTML 可视化来解释代码或概念，而不只是输出文字。这解决了”AI 解释代码太抽象、人类难以快速理解”的问题。

特点

  • 零运行时依赖：纯 SKILL.md 指令文件，不引入任何 SDK，不污染项目依赖
  • 开箱即用：一条 npx skills add 即可安装到 Claude Code，斜杠命令激活
  • 原子化设计：每个技能只做一件事，可单独安装、按需组合
  • 可验证输出：每个技能都有明确的触发条件和预期输出，不产出模糊结果
  • 跨项目复用：CLAUDE.md 片段和本地技能模板可直接拷贝到任何项目

使用方法

安装（单个技能）

npx skills add humanlayer/skills --skill improve-claude-md
npx skills add humanlayer/skills --skill narrow-react-prop-types
npx skills add humanlayer/skills --skill build-iterated-agentic-loop
npx skills add humanlayer/skills --skill design-control-loop
npx skills add humanlayer/skills --skill show-me

在 Claude Code 中调用

/improve-claude-md
/narrow-react-prop-types
/build-iterated-agentic-loop
/design-control-loop
/show-me

基本工作流示例

以 improve-claude-md 为例：

  1. 在已有 Claude Code 集成的项目中运行 /improve-claude-md
  2. 技能扫描当前 CLAUDE.md，提出基于任务类型的条件块重写方案
  3. 用户确认后，CLAUDE.md 被更新，后续对话中规则只在相关场景触发
  4. 无需手动维护大量静态规则，指令噪音大幅降低

使用场景与人群

适用场景：

  • 已有 Claude Code 集成的团队项目，需要提升 AI 对特定工程规范的遵循度
  • React 项目，Props 类型过于宽泛导致类型错误
  • 需要将临时 AI 任务固化为可复用本地技能和定时 Agent 循环的 DevOps 流程
  • 新人 onboarding，需要 AI 用可视化方式解释复杂代码库

目标用户：

  • 已用 Claude Code、Codex、Cursor 等 AI 编码助手的开发者
  • 团队技术负责人，想把工程最佳实践编码为可分发的 Agent 技能
  • 对 Agentic Workflow 有进阶需求，想构建本地技能 + 自动化循环的工程师

输入与输出案例

案例 1：improve-claude-md

输入（在 Claude Code 中执行）：

/improve-claude-md

输出（更新后的 CLAUDE.md 片段）：

# IMPORTANT if task_type == "react-component"
确保所有 Props 类型来自实际使用路径，不使用 `any`、`object` 或未经验证的类型别名。
在提交前运行 TypeScript 编译器检查。
# IMPORTANT if task_type == "pr-review"
优先检查：1) 是否有未处理的 edge case；2) 错误处理是否完整；3) 是否有安全漏洞。
不要只做风格审查。

案例 2：show-me

输入：

/show-me 解释这个函数的执行流程：
async function processOrder(orderId: string, items: CartItem[]) {
  const cart = await db.carts.findById(orderId);
  const validated = items.filter(i => i.quantity > 0);
  await payment.charge(cart.userId, validated);
  await db.orders.create({ cartId: orderId, items: validated });
  return { success: true, orderId };
}

输出（聚焦的 HTML artifact，带执行流程图和代码结构注解）。

GitHub: https://github.com/humanlayer/skills

评论区

0 条评论

登录后可评论。

Skill超级捕获手 10 阅读