Claude Code Infrastructure Showcase：生产级基础设施参考库

本文介绍 claude-code-infrastructure-showcase，一个精心策划的 Claude Code 生产级基础设施参考库。该项目提供了技能自动激活、Hooks 系统和专业 Agent 的完整解决方案，解决了 Claude Code 技能无法自动激活的核心问题。

项目简介

claude-code-infrastructure-showcase 是由 diet103 开发维护的开源项目，源于 6 个月复杂 TypeScript 微服务项目的实际使用经验。该项目在 GitHub 上已获得近 9000 stars，主要提供生产环境验证的 Claude Code 基础设施模式。

核心定位：这不是一个可运行的应用程序，而是一个参考库，你可以根据需要复制组件到自己的项目中。

核心特性

• 技能自动激活：通过 Hooks 和 skill-rules.json 实现技能自动触发
• 模块化技能模式：500 行规则 + 渐进式披露设计
• 专业 Agent 系统：10 个专门用于复杂任务的 Agent
• 开发文档系统：在上下文重置后依然保留项目上下文
• 通用示例：使用博客领域（Post/Comment/User）作为教学示例

技术栈

• Shell (60.1%) - Hook 脚本和自动化
• TypeScript - 类型定义和示例代码
• Markdown - 文档和技能定义

项目结构

.claude/
├── skills/                 # 5 个生产级技能
│   ├── backend-dev-guidelines/  # Node.js/Express/TypeScript 模式
│   ├── frontend-dev-guidelines/ # React/TypeScript/MUI v7 模式
│   ├── skill-developer/         # 创建技能的元技能
│   ├── route-tester/            # 测试认证路由
│   ├── error-tracking/          # Sentry 集成模式
│   └── skill-rules.json         # 技能激活配置
├── hooks/                  # 6 个自动化 Hook
│   ├── skill-activation-prompt.*  # 技能激活（核心）
│   ├── post-tool-use-tracker.sh   # 工具使用追踪（核心）
│   ├── tsc-check.sh               # TypeScript 检查（可选）
│   └── trigger-build-resolver.sh  # 构建解析（可选）
├── agents/                 # 10 个专业 Agent
│   ├── code-architecture-reviewer.md
│   ├── refactor-planner.md
│   ├── frontend-error-fixer.md
│   └── ... 7 个更多
└── commands/               # 3 个斜杠命令
    └── dev-docs.md

核心概念

1. 自动激活突破

问题：Claude Code 技能只是静静地待在那里，你必须记得使用它们。

解决方案：UserPromptSubmit Hook 实现：

• 分析用户提示
• 检查文件上下文
• 根据 skill-rules.json 自动建议相关技能
• 仅在需要时加载技能

结果：技能在需要时自动激活，而不是在你想起时才激活。

2. 渐进式披露（500 行规则）

问题：大型技能会触及上下文限制

解决方案：模块化结构

skill-name/
  SKILL.md                  # <500 行，高级指南
  resources/
    topic-1.md              # <500 行每个
    topic-2.md
    topic-3.md

Claude 首先加载主技能，仅在需要时加载资源。

3. 开发文档模式

问题：上下文重置丢失项目上下文

解决方案：三文件结构

• [task]-plan.md - 战略计划
• [task]-context.md - 关键决策和文件
• [task]-tasks.md - 清单格式

配合 /dev-docs 斜杠命令自动生成。

快速开始

路径 1：技能自动激活（推荐）

复制以下文件：

1. skill-activation-prompt hook（2 个文件）
2. 相关技能
3. 15 分钟配置时间

👉 设置指南：.claude/hooks/README.md

路径 2：添加单个技能

浏览技能目录并复制所需内容：

👉 技能指南：.claude/skills/README.md

路径 3：使用专业 Agent

10 个生产级 Agent，独立使用：

• code-architecture-reviewer - 代码架构审查
• refactor-planner - 重构策略规划
• frontend-error-fixer - 前端错误调试
• web-research-specialist - 在线技术研究
• 以及 6 个更多...

👉 Agent 指南：.claude/agents/README.md

集成工作流

推荐方法：

阶段 1：技能激活（15 分钟）

• 复制 skill-activation-prompt hook
• 复制 post-tool-use-tracker hook
• 更新 settings.json
• 安装 hook 依赖

阶段 2：添加第一个技能（10 分钟）

• 选择一个相关技能
• 复制技能目录
• 创建/更新 skill-rules.json
• 自定义路径模式

阶段 3：测试与迭代（5 分钟）

• 编辑文件 - 技能应该激活
• 提问 - 技能应该被建议
• 根据需要添加更多技能

阶段 4：可选增强

• 添加有用的 Agent
• 添加斜杠命令
• 自定义 Stop hook（高级）

生产验证

这些模式经过以下验证：

• ✅ 6 个生产环境微服务
• ✅ 50,000+ 行 TypeScript 代码
• ✅ 复杂数据网格的 React 前端
• ✅ 复杂工作流引擎
• ✅ 6 个月日常 Claude Code 使用

项目链接

• GitHub 仓库：https://github.com/diet103/claude-code-infrastructure-showcase
• Stars：~9k
• Forks：~1.2k
• 主要语言：Shell (60.1%)

注意事项

1. settings.json 是示例：Stop hook 引用特定的 monorepo 结构，需要根据你的项目定制
2. 博客领域示例：Post/Comment/User 是教学示例，模式适用于任何领域
3. Hook 目录结构：某些 hook 期望特定结构，需要根据你的项目布局自定义