npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

@wyouwd1/cc-hud

v0.7.3

Published

Compact statusline HUD for Claude Code / OpenCode — context, agents, rate limits

Readme

为什么用 CC-HUD?

问题: Claude Code 的原生安装器内嵌了 Bun,在 Windows 上存在已知的内存分配器 Bug(oven-sh/bun#25082)。状态栏插件(如 jarrodwatts/claude-hud)在 每次 tick 都会运行,放大了内存压力,大大增加 pas panic 崩溃的几率。

解决方案: CC-HUD 是一个零崩溃的替代方案 — 纯 Node.js、零依赖、每次调用无状态、~60ms 渲染、2s 硬超时。专为保持状态栏稳定运行而设计,不会拖垮 Claude Code。

[!TIP] Windows 用户: 建议用 npm i -g @anthropic-ai/claude-code 代替原生安装器,彻底规避 Bun 崩溃。

功能

安装

在 Claude Code 中执行:

/plugin marketplace add wyoud1/cc-hud
/plugin install cc-hud@cc-hud
/reload-plugins
/cc-hud:setup        # 幂等,可重复运行

完成 — 无需重启;/reload-plugins 热加载 HUD。

[!NOTE] /cc-hud:setup 会在 ~/.claude/bin/cc-hud-launcher.cjs 安装一个小型启动器,并将 statusLine.command 指向它。该命令是幂等的——重复运行会自动迁移旧版路径,已是新版则直接跳过。

升级

/plugin marketplace update cc-hud
/reload-plugins

[!NOTE] 自 v0.5.0 起,/cc-hud:setup 安装了一个小型启动器位于 ~/.claude/bin/cc-hud-launcher.cjs,并将 statusLine.command 指向它。启动器在每次 tick 时解析当前已安装的 cc-hud 版本,因此插件升级不再需要重新运行 /cc-hud:setup

≤0.4.x 升级?重新运行 /cc-hud:setup 一次——它会自动检测旧版路径并迁移到启动器。

npm i -g @wyouwd1/cc-hud

添加到 ~/.claude/settings.json

{
  "statusLine": {
    "type": "command",
    "command": "npx @wyouwd1/cc-hud",
    "padding": 2
  }
}
git clone https://github.com/wyouwd1/cc-hud.git
cd cc-hud && npm install && npm run build

添加到 ~/.claude/settings.json

{
  "statusLine": {
    "type": "command",
    "command": "node /absolute/path/to/cc-hud/dist/index.js",
    "padding": 2
  }
}

OpenCode 插件安装

安装 npm 包:

npm i -g @wyouwd1/cc-hud

opencode.json 中添加插件:

{
  "plugin": ["@wyouwd1/cc-hud/opencode-plugin"]
}

配置 tmux 状态栏读取输出文件:

set -g status-right '#(cat ~/.cc-hud-status)'

如果通过本地文件使用(开发模式),将 opencode-plugin/ 目录复制或软链到 .opencode/plugins/cc-hud/,然后在 opencode.json 中:

{
  "plugin": [".opencode/plugins/cc-hud"]
}

配置项(在 opencode.json 中):

{
  "cc-hud": {
    "theme": "catppuccin",
    "compact": false,
    "statusFile": "~/.cc-hud-status"
  }
}

环境变量(优先级更高):CC_HUD_THEMECC_HUD_COMPACTCC_HUD_STATUS_FILE

工作原理

Claude Code ──stdin JSON──→  ~/.claude/bin/cc-hud-launcher.cjs   ← 稳定路径 (v0.5+)
                              │ 解析当前安装的 cc-hud
                              ▼
                             cc-hud dist/index.js  ──stdout──→ 状态栏
                              ↘ transcript JSONL (尾部 64KB → 活跃代理)

OpenCode ──event hook────→  opencode-plugin/index.ts
                              │ SessionCollector → adapter → render()
                              ▼
                             ~/.cc-hud-status  ──tmux status-right──→ 状态栏

自动检测的后端

cc-hud 会自动检测你的 ANTHROPIC_BASE_URL,自动拉取余额 / 配额 / 订阅信息——零配置,本地缓存 5 分钟。模型名称会自动美化(glm-5.2[1m]GLM 5.2 (1M)MiniMax-M3MiniMax M3 等)。设置 CC_HUD_THEME 可切换配色方案。

输出示例:

[OpenCode Go]      █▍░░░░░░░░ 14% (1M) │ 5h:2% (2.6h) │ 7d:23% (2.7d) │ mo:39% (8.8d)
[DeepSeek V4 Pro] ██░░░░░░░░ 20% │ ¥13.44
[MiniMax M3]      █▎░░░░░░░░ 13% │ 5h:17% (1.1h) │ 7d:2% (6.4d)
[GLM 5.2]         ████▏░░░░░ 41% (1M) │ ¥88.50
[Qwen 2.5]        ██░░░░░░░░ 20% │ ¥88.50
[Moonshot v1]     ██░░░░░░░░ 20% │ ¥66.60
[Groq Llama]      █▎░░░░░░░░ 13% │ 9500
[Coding Plan Pro] ██░░░░░░░░ 20% │ 5h:0% (─) │ 7d:1% (2.3d) │ mo:3% (6.9d)

兼容 dscode / mmcode / glmcode / ZCode 或任何设置了 ANTHROPIC_BASE_URL + ANTHROPIC_AUTH_TOKEN 的启动器。

百炼 Coding Plan

百炼 Coding Plan 套餐通过阿里云控制台 Cookie 认证,显示 5 小时/每周/每月 3 档配额及重置倒计时:

// ~/.claude/settings.json
{
  "env": {
    "CC_HUD_BAILIAN_COOKIE": "login_aliyunid_ticket=xxx; tfstk=yyy; ...",
    "CC_HUD_BAILIAN_SEC_TOKEN": "xxxxx",
    "CC_HUD_BAILIAN_REGION": "cn-beijing"
  }
}

| 变量 | 说明 | 必须 | |------|------|------| | CC_HUD_BAILIAN_COOKIE | 阿里云登录 Cookie | 是 | | CC_HUD_BAILIAN_SEC_TOKEN | 控制台请求的 sec_token 参数 | 是 | | CC_HUD_BAILIAN_REGION | 区域,默认 cn-beijing | 否 |

  1. 浏览器打开 百炼控制台 → Coding Plan,确保已登录
  2. F12 打开开发者工具,切换到 Network(网络) 标签
  3. 勾选 Preserve log(保留日志)
  4. 刷新页面,在请求列表中找到 data/api.json(或过滤 codingPlan
  5. 点击该请求,在右侧面板:
    • CookieHeaders(请求头) 标签 → Request Headers 下的 cookie 字段 → 复制整个值
    • sec_tokenPayload(负载) 标签 → 找到 sec_token 参数 → 复制其值
  6. 将 Cookie 和 sec_token 填入上方 settings.json 对应的环境变量

⚠️ Cookie 有有效期(通常几小时到几天),过期后需重新获取。建议每月更新一次。 如果多次获取麻烦,可写脚本定时从浏览器导出 Cookie 写入环境变量。

其他后端 / 自定义额外字段

对于未列出的后端,或需要显示自定义文本时,可设置 CC_HUD_EXTRA_FILE 环境变量指向一个文件,文件的第一行即为要显示的文本。该文件在每次 HUD tick 时同步读取——保持内容轻量。

// ~/.claude/settings.json
{
  "env": {
    "CC_HUD_EXTRA_FILE": "C:/Users/yourname/.claude/hud/extra.txt"
  }
}

[!IMPORTANT] Windows 用户: 始终使用正斜杠C:/Users/...)或转义反斜杠C:\\Users\\...)。原始反斜杠 C:\Users\... 会导致 Node.js \0 空字节截断,文件会静默无法读取。

额外字段出现在状态栏右侧,上下文条之后:

[Sonnet 4.6] ██░░░░░░░░ 20% (1M) │ 5h:7% (1.7h) │ 7d:25% (2.8d) │ mo:39% (8.8d)

参考实现:

| 脚本 | 用途 | | --- | --- | | scripts/ds-balance-cache.sh | 查询 DeepSeek 余额,缓存到 CC_HUD_EXTRA_FILE 目标 |

个性化

主题

设置 CC_HUD_THEME 切换配色方案:

| 值 | 调色板 | |-------|---------| | catppuccin(默认)| Catppuccin Mocha — 绿 / 黄 / 桃 / 红 | | dracula | Dracula — 绿 / 黄 / 橙 / 红 | | nord | Nord — 极光绿 / 黄 / 橙 / 红 |

// ~/.claude/settings.json
{
  "env": {
    "CC_HUD_THEME": "dracula"
  }
}

紧凑模式

设置 CC_HUD_COMPACT=1 仅显示模型名和上下文进度条——适合窄终端或极简布局:

// ~/.claude/settings.json
{
  "env": {
    "CC_HUD_COMPACT": "1"
  }
}

输出简化为:[Sonnet 4.6] ██░░░░░░░░ 20%

开发

npm install
npm run build        # 编译 TypeScript → dist/
npm test             # 181 个测试 (node:test)

项目结构:

| 路径 | 说明 | | --- | --- | | src/ | TypeScript 源码 — 入口、渲染、模型美化、DeepSeek / MiniMax / GLM / OpenCode Go / Qwen / Moonshot / Groq / 百炼 | | scripts/launcher.cjs | 稳定路径启动器(/cc-hud:setup 复制到 ~/.claude/bin/)| | commands/setup.md | /cc-hud:setup 斜杠命令 | | tests/ | node:test 单元测试 | | dist/ | 编译产物,已提交 |

致谢

cc-hud 最初由 WaterWaterTian/cc-hud)创建。本仓库是独立维护的 fork,包含持续开发和新增功能。

Star 历史