claude-code-templates-cli

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Claude Code Templates CLI

Claude Code Templates CLI

Skill by ara.so — Claude Code Skills collection.
The
claude-code-templates
CLI provides a comprehensive collection of ready-to-use configurations for Anthropic's Claude Code, including AI agents, custom commands, MCPs (Model Context Protocol integrations), settings, hooks, and skills. It offers both interactive browsing and direct installation of components to enhance AI-powered development workflows.
ara.so开发的Skill — Claude Code Skills合集。
claude-code-templates
CLI为Anthropic的Claude Code提供了一套全面的即用型配置集合,包括AI Agent、自定义命令、MCP(Model Context Protocol集成)、设置、钩子和Skill。它支持交互式浏览和直接安装组件,以增强AI驱动的开发工作流。

Installation

安装

The CLI can be run directly with
npx
without installation:
bash
npx claude-code-templates@latest
For frequent use, install globally:
bash
npm install -g claude-code-templates
无需安装即可通过
npx
直接运行CLI:
bash
npx claude-code-templates@latest
如需频繁使用,可全局安装:
bash
npm install -g claude-code-templates

Core Commands

核心命令

Interactive Installation

交互式安装

Launch the interactive browser to explore and install components:
bash
npx claude-code-templates@latest
This opens a menu-driven interface to browse agents, commands, MCPs, settings, and hooks.
启动交互式浏览器来浏览并安装组件:
bash
npx claude-code-templates@latest
这会打开一个菜单驱动的界面,用于浏览Agent、命令、MCP、设置和钩子。

Direct Component Installation

直接安装组件

Install specific components using flags:
bash
undefined
使用标志安装特定组件:
bash
undefined

Install an agent

安装Agent

npx claude-code-templates@latest --agent development-team/frontend-developer --yes
npx claude-code-templates@latest --agent development-team/frontend-developer --yes

Install a command

安装命令

npx claude-code-templates@latest --command testing/generate-tests --yes
npx claude-code-templates@latest --command testing/generate-tests --yes

Install an MCP integration

安装MCP集成

npx claude-code-templates@latest --mcp development/github-integration --yes
npx claude-code-templates@latest --mcp development/github-integration --yes

Install a setting

安装设置

npx claude-code-templates@latest --setting performance/mcp-timeouts --yes
npx claude-code-templates@latest --setting performance/mcp-timeouts --yes

Install a hook

安装钩子

npx claude-code-templates@latest --hook git/pre-commit-validation --yes

The `--yes` flag skips confirmation prompts for automated workflows.
npx claude-code-templates@latest --hook git/pre-commit-validation --yes

`--yes`标志会跳过确认提示,适用于自动化工作流。

Batch Installation

批量安装

Install multiple components in a single command:
bash
npx claude-code-templates@latest \
  --agent development-team/frontend-developer \
  --agent security/security-auditor \
  --command testing/generate-tests \
  --mcp development/github-integration \
  --yes
在单个命令中安装多个组件:
bash
npx claude-code-templates@latest \
  --agent development-team/frontend-developer \
  --agent security/security-auditor \
  --command testing/generate-tests \
  --mcp development/github-integration \
  --yes

Development Tools

开发工具

Analytics Dashboard

分析仪表盘

Monitor Claude Code sessions with real-time state detection:
bash
npx claude-code-templates@latest --analytics
Opens a web interface showing:
  • Active conversation state
  • Performance metrics
  • Token usage
  • Session timeline
通过实时状态检测监控Claude Code会话:
bash
npx claude-code-templates@latest --analytics
打开一个Web界面,展示:
  • 活跃对话状态
  • 性能指标
  • Token使用情况
  • 会话时间线

Conversation Monitor

对话监控器

View Claude responses in real-time with mobile-optimized interface:
bash
undefined
通过移动端优化界面实时查看Claude响应:
bash
undefined

Local access

本地访问

npx claude-code-templates@latest --chats
npx claude-code-templates@latest --chats

Remote access via Cloudflare Tunnel

通过Cloudflare Tunnel远程访问

npx claude-code-templates@latest --chats --tunnel

The tunnel option provides secure remote access without port forwarding.
npx claude-code-templates@latest --chats --tunnel

Tunnel选项无需端口转发即可提供安全的远程访问。

Health Check

健康检查

Run comprehensive diagnostics:
bash
npx claude-code-templates@latest --health-check
Checks:
  • Claude Code installation
  • Configuration validity
  • MCP integrations
  • File permissions
  • Dependencies
运行全面诊断:
bash
npx claude-code-templates@latest --health-check
检查内容包括:
  • Claude Code安装情况
  • 配置有效性
  • MCP集成状态
  • 文件权限
  • 依赖项

Plugin Dashboard

插件仪表盘

Manage installed plugins and view marketplaces:
bash
npx claude-code-templates@latest --plugins
管理已安装插件并查看市场:
bash
npx claude-code-templates@latest --plugins

Component Types

组件类型

Agents

Agent

Specialized AI personas for specific development tasks:
bash
undefined
针对特定开发任务的专业AI角色:
bash
undefined

Install a frontend developer agent

安装前端开发Agent

npx claude-code-templates@latest --agent development-team/frontend-developer --yes
npx claude-code-templates@latest --agent development-team/frontend-developer --yes

Install a security auditor

安装安全审计Agent

npx claude-code-templates@latest --agent security/security-auditor --yes
npx claude-code-templates@latest --agent security/security-auditor --yes

Install a database architect

安装数据库架构师Agent

npx claude-code-templates@latest --agent data/database-architect --yes

Agents are installed to `.claude/agents/` in your project.
npx claude-code-templates@latest --agent data/database-architect --yes

Agent会安装到项目的`.claude/agents/`目录下。

Commands

命令

Custom slash commands for Claude Code:
bash
undefined
Claude Code的自定义斜杠命令:
bash
undefined

Add test generation command

添加测试生成命令

npx claude-code-templates@latest --command testing/generate-tests --yes
npx claude-code-templates@latest --command testing/generate-tests --yes

Add bundle optimization command

添加包优化命令

npx claude-code-templates@latest --command performance/optimize-bundle --yes
npx claude-code-templates@latest --command performance/optimize-bundle --yes

Add security check command

添加安全检查命令

npx claude-code-templates@latest --command security/check-security --yes

Commands are installed to `.claude/commands/` and can be invoked with `/command-name`.
npx claude-code-templates@latest --command security/check-security --yes

命令会安装到`.claude/commands/`目录,可通过`/command-name`调用。

MCPs (Model Context Protocol)

MCP(Model Context Protocol)

External service integrations:
bash
undefined
外部服务集成:
bash
undefined

GitHub integration

GitHub集成

npx claude-code-templates@latest --mcp development/github-integration --yes
npx claude-code-templates@latest --mcp development/github-integration --yes

PostgreSQL integration

PostgreSQL集成

npx claude-code-templates@latest --mcp database/postgresql-integration --yes
npx claude-code-templates@latest --mcp database/postgresql-integration --yes

AWS integration

AWS集成

npx claude-code-templates@latest --mcp cloud/aws-integration --yes

MCPs require configuration with environment variables:

```bash
npx claude-code-templates@latest --mcp cloud/aws-integration --yes

MCP需要通过环境变量配置:

```bash

Example: GitHub MCP configuration

示例:GitHub MCP配置

export GITHUB_TOKEN=your_token_here export GITHUB_OWNER=your_username export GITHUB_REPO=your_repo
undefined
export GITHUB_TOKEN=your_token_here export GITHUB_OWNER=your_username export GITHUB_REPO=your_repo
undefined

Settings

设置

Claude Code configuration presets:
bash
undefined
Claude Code配置预设:
bash
undefined

Optimize MCP timeouts

优化MCP超时设置

npx claude-code-templates@latest --setting performance/mcp-timeouts --yes
npx claude-code-templates@latest --setting performance/mcp-timeouts --yes

Configure memory settings

配置内存设置

npx claude-code-templates@latest --setting performance/memory-limits --yes

Settings are merged into `.claude/settings.json`.
npx claude-code-templates@latest --setting performance/memory-limits --yes

设置会合并到`.claude/settings.json`中。

Hooks

钩子

Automation triggers for development workflows:
bash
undefined
开发工作流的自动化触发器:
bash
undefined

Pre-commit validation

提交前验证

npx claude-code-templates@latest --hook git/pre-commit-validation --yes
npx claude-code-templates@latest --hook git/pre-commit-validation --yes

Post-completion actions

完成后操作

npx claude-code-templates@latest --hook workflow/post-completion --yes
undefined
npx claude-code-templates@latest --hook workflow/post-completion --yes
undefined

Configuration

配置

The CLI respects Claude Code's standard configuration structure:
.claude/
├── agents/           # Installed agents
├── commands/         # Custom commands
├── mcps/            # MCP integrations
├── settings.json    # Global settings
├── hooks/           # Automation hooks
└── skills/          # Reusable capabilities
CLI遵循Claude Code的标准配置结构:
.claude/
├── agents/           # 已安装的Agent
├── commands/         # 自定义命令
├── mcps/            # MCP集成
├── settings.json    # 全局设置
├── hooks/           # 自动化钩子
└── skills/          # 可复用能力

Environment Variables

环境变量

For MCP integrations requiring credentials:
bash
undefined
对于需要凭证的MCP集成:
bash
undefined

GitHub

GitHub

export GITHUB_TOKEN=${GITHUB_TOKEN}
export GITHUB_TOKEN=${GITHUB_TOKEN}

PostgreSQL

PostgreSQL

export POSTGRES_HOST=${POSTGRES_HOST} export POSTGRES_USER=${POSTGRES_USER} export POSTGRES_PASSWORD=${POSTGRES_PASSWORD}
export POSTGRES_HOST=${POSTGRES_HOST} export POSTGRES_USER=${POSTGRES_USER} export POSTGRES_PASSWORD=${POSTGRES_PASSWORD}

AWS

AWS

export AWS_ACCESS_KEY_ID=${AWS_ACCESS_KEY_ID} export AWS_SECRET_ACCESS_KEY=${AWS_SECRET_ACCESS_KEY}
undefined
export AWS_ACCESS_KEY_ID=${AWS_ACCESS_KEY_ID} export AWS_SECRET_ACCESS_KEY=${AWS_SECRET_ACCESS_KEY}
undefined

Common Patterns

常见模式

Setting Up a Development Stack

搭建开发栈

bash
undefined
bash
undefined

Install a complete frontend development environment

安装完整的前端开发环境

npx claude-code-templates@latest
--agent development-team/frontend-developer
--agent performance/react-optimizer
--command testing/generate-tests
--command performance/optimize-bundle
--mcp development/github-integration
--setting performance/mcp-timeouts
--yes
undefined
npx claude-code-templates@latest
--agent development-team/frontend-developer
--agent performance/react-optimizer
--command testing/generate-tests
--command performance/optimize-bundle
--mcp development/github-integration
--setting performance/mcp-timeouts
--yes
undefined

Adding Security Tools

添加安全工具

bash
undefined
bash
undefined

Security-focused setup

安全导向的配置

npx claude-code-templates@latest
--agent security/security-auditor
--command security/check-security
--command security/dependency-audit
--hook git/pre-commit-validation
--yes
undefined
npx claude-code-templates@latest
--agent security/security-auditor
--command security/check-security
--command security/dependency-audit
--hook git/pre-commit-validation
--yes
undefined

Database Development

数据库开发

bash
undefined
bash
undefined

Database-focused setup

数据库导向的配置

npx claude-code-templates@latest
--agent data/database-architect
--command database/optimize-queries
--mcp database/postgresql-integration
--yes
undefined
npx claude-code-templates@latest
--agent data/database-architect
--command database/optimize-queries
--mcp database/postgresql-integration
--yes
undefined

Programmatic Usage

程序化使用

The CLI can be imported as a Node.js module:
javascript
const { installComponent } = require('claude-code-templates');

// Install an agent programmatically
await installComponent({
  type: 'agent',
  name: 'development-team/frontend-developer',
  skipConfirmation: true
});

// Install multiple components
const components = [
  { type: 'agent', name: 'security/security-auditor' },
  { type: 'command', name: 'testing/generate-tests' },
  { type: 'mcp', name: 'development/github-integration' }
];

for (const component of components) {
  await installComponent({ ...component, skipConfirmation: true });
}
CLI可作为Node.js模块导入:
javascript
const { installComponent } = require('claude-code-templates');

// 程序化安装Agent
await installComponent({
  type: 'agent',
  name: 'development-team/frontend-developer',
  skipConfirmation: true
});

// 安装多个组件
const components = [
  { type: 'agent', name: 'security/security-auditor' },
  { type: 'command', name: 'testing/generate-tests' },
  { type: 'mcp', name: 'development/github-integration' }
];

for (const component of components) {
  await installComponent({ ...component, skipConfirmation: true });
}

Troubleshooting

故障排除

Components Not Appearing in Claude Code

组件未在Claude Code中显示

Verify installation location:
bash
ls -la .claude/agents/
ls -la .claude/commands/
ls -la .claude/mcps/
Ensure Claude Code is configured to read from the
.claude
directory.
验证安装位置:
bash
ls -la .claude/agents/
ls -la .claude/commands/
ls -la .claude/mcps/
确保Claude Code配置为读取
.claude
目录。

MCP Integration Failures

MCP集成失败

Run health check to diagnose MCP issues:
bash
npx claude-code-templates@latest --health-check
Verify environment variables are set:
bash
echo $GITHUB_TOKEN
echo $POSTGRES_HOST
运行健康检查诊断MCP问题:
bash
npx claude-code-templates@latest --health-check
验证环境变量已设置:
bash
echo $GITHUB_TOKEN
echo $POSTGRES_HOST

Permission Errors

权限错误

Ensure write permissions to the
.claude
directory:
bash
chmod -R u+w .claude/
确保对
.claude
目录有写入权限:
bash
chmod -R u+w .claude/

Tunnel Connection Issues

Tunnel连接问题

For remote conversation monitoring, ensure Cloudflare CLI is installed:
bash
undefined
如需远程对话监控,请确保已安装Cloudflare CLI:
bash
undefined

Install cloudflared

安装cloudflared

brew install cloudflare/cloudflare/cloudflared
brew install cloudflare/cloudflare/cloudflared
undefined
undefined

Component Conflicts

组件冲突

If components conflict, remove existing ones:
bash
rm .claude/agents/conflicting-agent.md
npx claude-code-templates@latest --agent new/agent --yes
若组件冲突,请移除现有组件:
bash
rm .claude/agents/conflicting-agent.md
npx claude-code-templates@latest --agent new/agent --yes

Web Interface

Web界面

Browse all available components at aitmpl.com:
  • Filter by category (agents, commands, MCPs, settings, hooks)
  • Search by keywords
  • View component details and examples
  • Copy installation commands
  • Track installation statistics
Documentation available at docs.aitmpl.com.
可在aitmpl.com浏览所有可用组件:
  • 按类别筛选(Agent、命令、MCP、设置、钩子)
  • 按关键词搜索
  • 查看组件详情和示例
  • 复制安装命令
  • 跟踪安装统计数据
文档可访问docs.aitmpl.com