Claude Code 状态栏
课程导读
这节课主要讲如何给 Claude Code 添加自定义状态栏。相比每次输入 /context 查看上下文，状态栏可以把模型、上下文占用、费用、Git 分支等信息实时显示在输入框下方。
一、使用 statusline 命令
Claude Code 内置了 /statusline 命令，可以根据你的自然语言需求自动生成状态栏脚本。
示例：
/statusline 显示模型名称和上下文百分比，并带有进度条发送后，Claude Code 会自动完成这些事情：
| 步骤 | 说明 |
|---|---|
| 生成脚本 | 在用户目录下的 .claude 配置目录中创建状态栏脚本 |
| 更新配置 | 自动修改 Claude Code 设置 |
| 显示状态栏 | 在输入框下方显示状态栏内容 |
常见配置目录：
| 系统 | 路径 |
|---|---|
| macOS / Linux | ~/.claude/ |
| Windows | %USERPROFILE%\.claude\ |
这种方式适合快速上手。
二、状态栏的工作原理
Claude Code 的状态栏本质上是一个本地脚本。
它的工作流程可以简单理解为：
- Claude Code 把当前会话数据以 JSON 的形式传给脚本。
- 脚本读取这些数据。
- 脚本输出一行或多行文本。
- Claude Code 把脚本输出显示在底部状态栏。
状态栏脚本可以显示多行内容，也可以使用颜色、链接和进度条。
状态栏脚本在本地运行，不会消耗 API Token。
三、使用开源状态栏工具
除了让 Claude Code 自动生成状态栏，也可以直接使用别人已经开发好的开源项目。
开源项目就是开发者把代码公开出来，允许其他人查看、学习和使用。很多开源项目都会发布在 GitHub 上。
本节课推荐尝试 ccstatusline-zh，它是 ccstatusline 的中文汉化版。
| 项目 | 说明 |
|---|---|
ccstatusline | 原版状态栏工具 |
ccstatusline-zh | 中文汉化版，界面更适合中文用户 |
四、安装 Node.js
使用 ccstatusline-zh 前，需要先安装 Node.js。
Node.js 是让 JavaScript 能在本地电脑运行的环境；npm 是 Node.js 自带的包管理工具，可以用来安装别人写好的工具包。
Node.js 下载页面：
Node.js 下载页面
| 系统 | 建议方式 |
|---|---|
| macOS | 可以复制官网给出的命令安装 |
| Windows | 建议下载安装包，然后一路下一步安装 |
相关概念：
| 名称 | 作用 |
|---|---|
| Node.js | 让 JavaScript 能在本地电脑运行 |
| npm | 下载、安装和管理 JavaScript 工具包 |
| nvm | 管理和切换不同 Node.js 版本 |
五、安装 ccstatusline-zh
安装命令：
npm install -g ccstatusline-zh启动配置界面：
ccstatusline-zh setup卸载命令：
npm uninstall -g ccstatusline-zh六、配置状态栏
执行 ccstatusline-zh setup 后，会进入交互式配置界面。
它支持实时预览状态栏效果，也支持添加、删除、移动和编辑组件。
常见操作可以按界面提示进行：
| 操作 | 作用 |
|---|---|
| 选择“编辑状态行” | 编辑某一行状态栏 |
d | 删除选中的组件 |
a | 添加新组件 |
i | 插入新组件 |
t | 切换 Powerline 模式 |
enter | 确认选择 |
它最多支持多行状态栏，你可以根据自己的习惯配置。
七、Powerline 模式
Powerline 模式主要是为了让状态栏更好看。
开启后，状态栏会呈现更明显的分段样式，也可以切换不同主题颜色和分隔符风格。
如果提示字体缺失，可以按界面提示安装对应字体。
适合调整的内容：
- 分隔符样式。
- 主题颜色。
- 每一行显示哪些组件。
- 是否使用多行状态栏。
配置完成后，重新打开 Claude Code，就可以看到状态栏显示在底部。
八、我的状态栏
如果你想直接使用我的状态栏样式，可以下载下面这个脚本，再让 Claude Code 按你的习惯继续调整。
statusline-xiaoyou.zip下载