返回技能列表

design-cli-output

pjt222
更新于 Yesterday
5 次查看
17
2
17
在 GitHub 上查看
设计design

关于

This skill helps developers design consistent, multi-level terminal output for CLI tools using chalk colors and Unicode symbols. It covers creating reporter functions with human, verbose, quiet, and JSON output levels, along with tone rules and cross-terminal compatibility. Use it when building new CLI reporter modules, standardizing output across commands, or adding warm narrative output alongside machine-readable JSON.

快速安装

Claude Code

推荐
主要方式
npx skills add pjt222/agent-almanac -a claude-code
插件命令备选方式
/plugin add https://github.com/pjt222/agent-almanac
Git 克隆备选方式
git clone https://github.com/pjt222/agent-almanac.git ~/.claude/skills/design-cli-output

在 Claude Code 中复制并粘贴此命令以安装该技能

技能文档

设计 CLI 输出

为命令行工具设计一致的、多级别的终端输出。

适用场景

  • 为 CLI 工具构建新的 reporter 模块
  • 在标准事务性输出旁添加温暖或叙事输出
  • 跨多个命令标准化输出格式
  • 设计与人类可读输出并行的 JSON 机器输出
  • 为新的终端工具选择颜色、图形符号和详细级别

输入

  • 必需:CLI 工具名称和主要受众(开发者、运维、终端用户)
  • 必需:需要输出格式化的命令
  • 可选:是否需要"ceremony"或叙事输出变体
  • 可选:品牌约束(配色板、语调)

步骤

第 1 步:定义配色板

使用 chalk 创建命名的配色板对象:

标准配色板(事务性输出):

let chalk;
try { chalk = (await import('chalk')).default; }
catch { chalk = new Proxy({}, { get: () => (s) => s }); }

// Status colors
const ok = chalk.green;       // success
const fail = chalk.red;       // errors
const warn = chalk.yellow;    // warnings
const info = chalk.cyan;      // identifiers, names
const dim = chalk.dim;        // secondary info, paths
const bold = chalk.bold;      // headers

温暖配色板(ceremony/叙事输出):

const C = {
  flame: chalk.hex('#FF6B35'),   // active elements, fire
  amber: chalk.hex('#FFB347'),   // arriving items, warm highlights
  spark: chalk.hex('#FFF4E0'),   // individual items (sparks/skills)
  ember: chalk.hex('#8B4513'),   // cold/dormant states
  warm:  chalk.hex('#D4A574'),   // neutral warm text
  dim:   chalk.dim,              // background, secondary
  fail:  chalk.red,              // errors stay red (honest)
};

配色板设计规则:

  • 始终提供无颜色后备(上面的 Proxy 模式)
  • 自定义配色板使用十六进制颜色(chalk.hex('#FF6B35')
  • 无论配色板主题如何,fail/error 颜色保持红色
  • 按语义角色而非视觉外观命名配色板条目

预期结果: 一个带有命名条目和无颜色后备的配色板对象。

失败处理: 若 chalk 不可用(管道输出、CI),Proxy 后备会原样返回字符串。使用 NO_COLOR=1 环境变量进行测试。

第 2 步:选择状态指示器

为状态通信选择 Unicode 图形符号或 ASCII 字符:

ASCII(最大兼容性):

+  created/installed (green)
-  removed/deleted (red)
=  skipped/unchanged (dim)
!  error/warning (red)

Unicode(更丰富,需要 UTF-8 终端):

✦  item/skill/practice (spark)
◉  active/burning state
◎  cooling/embers state
○  cold/dormant state
◌  available/not installed
✗  failed item
✓  success (use sparingly — not all terminals render it well)

选择标准:

  • ASCII 用于在 CI 或管道上下文中运行的工具
  • Unicode 用于面向交互式终端用户的工具
  • 通过 --ascii 标志或 NO_COLOR 检测同时提供两者
  • 在以下环境中测试图形符号:macOS Terminal、Windows Terminal、VS Code 终端、SSH 会话

预期结果: 一组无需仅依赖颜色就能一目了然传达状态的图形符号。

失败处理: 若图形符号在测试中渲染为 ? 或方框,替换为 ASCII 等价物。+/-/=/! 集到处都能用。

第 3 步:设计详细级别

每个命令应支持四个输出级别:

级别标志受众内容
默认(无)终端前的人格式化、有颜色、信息丰富
详细--verbose--ceremonial想要细节的人逐项分解、到达序列
安静--quiet脚本、CI最少行数、状态图标、无装饰
JSON--json机器消费者结构化、可解析、完整

实现模式:

function output(data, options) {
  if (options.json) {
    console.log(JSON.stringify(data, null, 2));
    return;
  }
  if (options.quiet) {
    for (const item of data.items) {
      const icon = item.ok ? '+' : '!';
      console.log(`${icon} ${item.id}`);
    }
    return;
  }
  // Default (or verbose) human output
  printFormatted(data, { verbose: options.verbose });
}

JSON 输出规则:

  • 始终是有效的 JSON(不与人类文本混合)
  • 包含人类输出显示的所有数据,加上对机器有用的字段
  • 跨命令使用一致的键命名
  • 退出码 0 表示成功、1 表示错误(无论输出模式如何)

预期结果: 四个清晰的输出级别,跨命令行为一致。

失败处理: 若 verbose 模式过于嘈杂,使其需主动选择(--ceremonial)而非分级的详细级别。

第 4 步:建立语调规则

定义所有输出函数遵循的语调和风格。这可以防止跨命令不一致。

示例语调规则(来自 campfire reporter):

  1. 现在时、主动语态:"mystic arrives" 而非 "mystic has been installed"
  2. 不用感叹号:安静的自信。工具不会大喊大叫。
  3. 隐喻取代行话:"practices" 而非 "dependencies"(仅用于 ceremony 模式)
  4. 失败诚实,不灾难化:"A spark was lost" 而非 "ERROR: installation failed with exit code 1"
  5. 结尾行反映状态:每个操作以状态摘要结束
  6. 不用表情符号:Unicode 图形符号承载视觉重量而不显装饰
  7. 每个词都承载信息:若一个词不增加理解,删除它

标准(非 ceremony)输出的语调规则:

  • 简洁、事实性的行
  • 状态图标 + 项 ID + 上下文
  • 带计数的摘要行
  • 错误消息建议纠正行动

预期结果: 一组书面的 3-7 条语调规则,输出函数必须遵守。

失败处理: 若规则感觉武断,测试它们:在使用与不使用每条规则的情况下编写相同输出。若移除规则不改变输出质量,规则不需要。

第 5 步:实现 Reporter 函数

将输出组织到 reporter 模块中,每个函数职责清晰:

// reporter.js — standard output
export function printResults(results) { ... }
export function printItemTable(items) { ... }
export function printDetections(detections) { ... }
export function printAudit(auditResults) { ... }
export function printDryRun() { ... }
export function warn(msg) { ... }
export function error(msg) { ... }
export { chalk };

每个函数遵循相同结构:

  1. 优雅地处理空/null 输入
  2. 计算布局(列宽、填充)
  3. 用配色板颜色输出
  4. 底部摘要行

对于 ceremony 输出,创建单独模块:

// campfire-reporter.js — warm narrative output
export function printArrival({ teamId, agents, results, ceremonial }) { ... }
export function printScatter({ teamId, agents, results }) { ... }
export function printTend(fires) { ... }
export function printCampfireList({ teams, state, reg }) { ... }
export function printFireSummary({ team, fireData, reg }) { ... }
export function printJson(data) { ... }

预期结果: 可独立使用的 reporter 函数 —— 每个处理自己的格式化,不依赖调用者状态。

失败处理: 若函数超过约 50 行,提取辅助函数。reporter 函数应能独立审查。

第 6 步:在不同环境中测试输出

验证输出在不同上下文中正确渲染:

# With colors (interactive terminal)
node cli/index.js list --domains

# Without colors (piped)
node cli/index.js list --domains | cat

# With NO_COLOR environment variable
NO_COLOR=1 node cli/index.js list --domains

# JSON mode (parseable)
node cli/index.js campfire --json | jq .

# In CI (typically no TTY)
CI=true node cli/index.js audit

检查:

  • 颜色在交互模式下正确显示
  • ANSI 转义码不泄漏到管道/重定向输出
  • JSON 有效(管道到 jq . 验证)
  • Unicode 图形符号在目标终端中渲染
  • 列对齐在不同内容宽度下保持

预期结果: 输出在所有五种上下文中都正确。

失败处理: 若 ANSI 码泄漏,确保 chalk 尊重 NO_COLOR。若 Unicode 损坏,提供 ASCII 后备模式。

验证清单

  • 配色板有无颜色后备
  • 状态指示器在颜色和无颜色模式下都工作
  • 所有四个详细级别产出有用输出
  • JSON 输出有效且可被 jq 解析
  • 语调规则有文档并被一致遵循
  • reporter 函数优雅地处理空/null 输入
  • 在以下环境测试输出:终端、管道、NO_COLOR、CI

常见问题

  • 将人类文本与 JSON 混合:在 --json 模式下,仅输出有效 JSON。一行散漫的文本(如 "DRY RUN")会破坏 JSON 解析器。若命令必须显示两者,清晰分离或在 JSON 模式下抑制人类文本。
  • 硬编码列宽:内容长度不同。使用 Math.max(...items.map(i => i.id.length)) 动态计算填充。
  • 无意义的颜色:若颜色是区分成功与失败的唯一方式,色盲用户和管道输出会丢失信息。始终将颜色与文本指示器配对(+OKERR)。
  • 错误上下文中的 ceremony:温暖叙事输出适合交互式终端会话。在 CI、脚本或 --quiet 模式下,它增加噪声。将 ceremony 输出放在显式标志后。
  • 遗忘摘要行:用户先扫描最后一行。每个操作应以一行摘要结束(成功/失败/跳过的计数)。

相关技能

  • scaffold-cli-command —— 使用此输出的命令
  • test-cli-application —— 测试输出与预期匹配
  • build-cli-plugin —— 插件通过此输出系统报告结果

GitHub 仓库

pjt222/agent-almanac
路径: i18n/zh-CN/skills/design-cli-output
0
agentsagentskillsai-assisted-developmentclaude-codeskillsteams

相关推荐技能

executing-plans

设计

该Skill用于当开发者提供完整实施计划时,以受控批次方式执行代码实现。它会先审阅计划并提出疑问,然后分批次执行任务(默认每批3个任务),并在批次间暂停等待审查。关键特性包括分批次执行、内置检查点和架构师审查机制,确保复杂系统实现的可控性。

查看技能

requesting-code-review

设计

该Skill可在完成任务、实现主要功能或合并代码前自动调度代码审查子代理,确保实现符合需求和计划。它支持通过指定git SHA范围进行精准的代码变更审查,帮助开发者在关键节点及时发现潜在问题。核心原则是"早审查、勤审查",适用于开发流程的各个关键阶段。

查看技能

connect-mcp-server

设计

这个Skill指导开发者如何将MCP服务器连接到Claude Code,支持HTTP、stdio和SSE三种传输协议。它涵盖了从安装配置到认证安全的完整流程,适用于集成GitHub、Notion、数据库等外部服务。当开发者需要添加集成、配置外部工具或提及MCP相关功能时,这个Skill能提供实用的操作指南。

查看技能

web-cli-teleport

设计

该Skill帮助开发者根据任务特性选择Claude Code的Web或CLI界面,并指导如何在两种环境间无缝迁移会话。它能分析任务复杂度、迭代需求等要素,推荐最优工作界面和工作流。关键特性包括会话状态管理、环境切换指导和上下文优化建议。

查看技能