前言

小伙伴们大家好,我是小溪,见字如面,最近发现一个Claude Code宝藏项目分享给大家,对Claude Code往期内容感兴趣的小伙伴也可以看往期内容:

简介

Claude Code Templates是Anthropic Claude Code 的即用型配置。 提供全面的 AI Agents、自定义命令、Settings、Hooks、MCP服务 和 项目模板集合,可极大增强我们的开发工作流程。

官网地址:https://www.aitmpl.com/agents

Github地址:https://github.com/davila7/claude-code-templates

基本使用

命令行工具

Claude Code Templates提供了CLI命令行工具,可以一行指令添加模版

1)交互式安装

Claude Code Templates支持使用交互式命令形式运行 分析、对话监听、Agents面板、项目初始化 以及 健康检查等工具,详细信息可以查看下方的【其他工具】

1
# 交互式浏览和安装 $ npx claude-code-templates@latest

2)安装特定模版

Claude Code Templates支持安装特定类型的模版,通过指定类型可以安装不同类型的模版

1
# 安装特定组件 $ npx claude-code-templates@latest --agent business-marketing/security-auditor $ npx claude-code-templates@latest --command performance/optimize-bundle $ npx claude-code-templates@latest --setting performance/mcp-timeouts $ npx claude-code-templates@latest --hook git/pre-commit-validation $ npx claude-code-templates@latest --mcp database/postgresql-integration

以 fullstack-developer Agent为例:

1
$ npx claude-code-templates@latest --agent=development-team/fullstack-developer --yes

回到项目可以发现此时 ./claude/agents/ 目录会多一个 fullstack-developer.md 文件

3)一键安装

Claude Code Templates也支持一键安装多种类型的模版

1
# 一键安装所有模版类型 npx claude-code-templates@latest --agent development-team/frontend-developer --command testing/generate-tests --mcp development/github-integration

可视化配置

如果不习惯使用命令行工具,Claude Code Templates还提供了可视化配置方式,可以直接通过官网查看:https://www.aitmpl.com/agents

1)快速检索

Claude Code Templates提供了 检索 和 详细的分类 用于快速查找模版

还提供了排序功能,可以根据 已验证优先、下载量最多、按字母顺序 进行排序

2)安装模版

点击任意一个模板项目可以 查看详情、复制安装命令 以及 添加到栈

进入模版详情可以查看模版的详细信息和完整的提示词内容

3)一键安装

Claude Code Templates提供一键安装多个模版功能,点击任意模版项目,点击【Add to Stack】

此时网站右下角会多一个购物车图标

打开购物车图标可以看到刚刚添加的模版信息

选择不同类型的模版可以生成一键安装配置

点击【Copy Command】复制模版安装命令如下:

1
$ npx claude-code-templates@latest --agent development-team/frontend-developer --command "documentation/create-architecture-documentation" --hook "automation/simple-notifications"

4)自定义模版

Claude Code Templates支持自定义模版配置,点击首页不同模版插件的【Add New】

根据提示完成配置、验证、提交

其他工具

Claude Code Templates还提供了 Claude Code分析、对话监视器、项目初始化、健康检查 等其他CLI功能。

1)Claude Code分析

使用实时状态检测和性能指标实时监控 AI 驱动的开发会话。

在命令行终端输入以下命令:

1
$ npx claude-code-templates@latest

选择【Analytics Dashboard】或者输入以下命令:

1
$ npx claude-code-templates@latest --analytics

执行完成后会在浏览器打开Claude Code分析服务http://localhost:3333/#dashboard,预览效果如下:

2)对话监视器

移动优化界面,通过安全的远程访问实时查看 Claude 响应。

Claude Code Templates面板选择【Chats Mobile】或者输入以下命令:

1
# Local access $ npx claude-code-templates@latest --chats # Secure remote access via Cloudflare Tunnel $ npx claude-code-templates@latest --chats --tunnel

执行完成后会在浏览器打开对话监视器服务 http://localhost:9876/,预览效果如下:

点击会话记录可以进入到会话详情,会话详情会展示当前会话所有的聊天记录内容

3)Agents仪表盘

查看并分析使用代理工具的 Claude 对话

Claude Code Templates面板选择【Agents Dashboard】,执行完成后会在浏览器打开对话监视器服务 http://localhost:3333/#agents,预览效果如下:

这里提示加载错误,暂时不知道什么原因。

4)插件仪表盘

从统一界面查看市场、已安装的插件并管理权限。

在命令行终端输入以下命令:

1
$ npx claude-code-templates@latest --plugins

执行完成后会在浏览器打开对话监视器服务 http://localhost:3336/,预览效果如下:

插件仪表板罗列了已安装的所有插件市场和插件,在这里可以直观的查看插件市场和插件的状态,进入插件详情可以查看插件的详细信息,甚至提供了所有插件的操作指令

5)项目初始化配置

为项目添加初始化配置

Claude Code Templates面板选择【Project Setup】,开发语言列表选择语言类型,这里以【JavaScript/TypeScript】为例

选择开发框架

接下来根据自己的需求配置

初始化完成后,我们将得到一个如下结构的项目目录,包含了一系列自定义命令、配置、MCP 和 记忆文件

6)健康检查

全面的诊断,确保您的 Claude Code 安装得到优化。

Claude Code Templates面板选择【Health Check】或者输入以下命令:、

1
$ npx claude-code-templates@latest --health-check

执行完成后预览效果如下:

友情提示

见原文:分享一个Claude Code宝藏网站Claude Code Templates

本文同步自微信公众号 “程序员小溪” ,这里只是同步,想看及时消息请移步我的公众号,不定时更新我的学习经验。友情提示友情提示