claude-hud
Claude Code 插件,实时可视化上下文使用率、工具活动、Agent 运行状态和待办进度
加载项目详情…
本应用为开源项目,仅供学习研究,请遵守其开源协议。
Claude Code 插件,实时可视化上下文使用率、工具活动、Agent 运行状态和待办进度
加载项目详情…
本应用为开源项目,仅供学习研究,请遵守其开源协议。
想象一下:你正在用 Claude Code 编写一个复杂的微服务架构,Claude 正在同时处理文件编辑、代码搜索、测试运行,还启动了几个子 Agent 帮你并行工作。这时候你突然想知道:上下文窗口还剩多少?当前用的模型是什么?那些子 Agent 都在干嘛? 在 Claude HUD 出现之前,你只能靠猜测。而现在,有一个工具能把这些信息全部可视化在你眼前。
Claude HUD 由知名开源开发者 Jarrod Watts 创建,他是 Claude Code 插件生态的活跃贡献者,目前担任 Anthropic 官方 Claude Code 团队的 Maintainer。该项目发布后在 GitHub 迅速获得超过 23,000 颗星,成为 Claude Code 插件市场中热度最高的插件之一。 这类插件的出现,标志着 Claude Code 正在从对话式编程工具演化为可扩展的开发环境。类似 VS Code 的插件生态,Claude Code 开放了 Plugin API,让开发者可以为它构建增强功能。
Claude HUD 是一个 Claude Code 插件,在命令行底部插入一条持久状态栏(statusline),将原本隐藏在 Claude 内部的信息实时呈现给用户。它用类似终端多路复用的方式,把 Claude 的思考过程可视化。 状态栏分为两行:**第一行(基础信息)**显示当前模型名称(如 Opus)、项目路径、git 分支。**第二行(资源信息)**显示上下文窗口使用率进度条(颜色从绿到黄到红递进),以及 API 使用量限制的倒计时。 此外,通过配置还可以显示:
Claude HUD 的安装流程极为简单,只需在 Claude Code 中运行以下命令: 步骤一:添加插件市场到 Claude Code /plugin marketplace add jarrodwatts/claude-hud 步骤二:安装插件 /plugin install claude-hud 步骤三:重载插件并初始化配置 /reload-plugins /claude-hud:setup 安装后需要重启 Claude Code 以加载新的 statusLine 配置。值得注意的是,作者对跨平台差异做了充分考虑:
Claude HUD 采用 TypeScript 开发,使用 Node.js >= 18.0.0,目标文件为 dist/index.js(编译产物),源码在 src/ 目录。项目的测试策略较为完善:使用 Node.js 原生 test runner 配合 c8 覆盖率工具,并提供了 UPDATE_SNAPSHOTS=1 机制用于更新测试快照。 插件通过 Claude Code 的 Plugin API 与宿主程序通信,监听会话中的工具调用、Agent 启动、上下文变化等事件,并将这些事件渲染到终端状态栏。项目代码量适中,单文件架构,MIT 许可证,无外部 AI/ML 依赖,本质是一个纯前端展示工具。
Claude HUD 的局限很明显:它完全依赖 Claude Code 本身。没有安装 Claude Code,这个插件毫无用武之地。同时,状态栏的渲染依赖于终端对 ANSI 颜色代码的支持,某些终端模拟器可能存在兼容性问题。 另一个值得关注的点是信息过载风险:对于简单任务,HUD 显示的信息可能过于密集,反而分散注意力。作者通过可配置的模块化设计来缓解这一点,用户可以按需启用/禁用各行显示。
Claude HUD 的诞生反映了 AI 编程工具的一个重要趋势:从黑盒 AI 到透明 AI 的转变。当 Claude 越来越像一个能自主决策的智能体时,开发者对其内部状态的可观测性需求急剧增长。HUD 这样的工具,本质上是在为 Claude 构建运维仪表盘。 随着 Claude Code 插件生态的成熟,未来可能会出现类似 VS Code Marketplace 的 Claude Plugin Marketplace,而 Claude HUD 正在成为这个生态的标杆插件。 项目主页:https://github.com/jarrodwatts/claude-hud 许可证:MIT 技术栈:TypeScript / Node.js 前置要求:Claude Code + Node.js >= 18 安装难度:极简单(2分钟)