V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
haogre
V2EX  ›  Claude

用 Vibe Coding 做了一个 Claude Code 用量(实时)监控工具,实时显示在菜单栏

  •  
  •   haogre · 8 小时 35 分钟前 · 197 次点击

    用 Vibe Coding 做了一个 Claude Code 用量(实时)监控工具,实时显示在菜单栏

    最近一直在用 Claude Code 写代码,但每次想知道"这次对话花了多少钱"都得手动去翻日志文件,很不方便。于是我决定做一个菜单栏工具来解决这个问题。

    整个项目从 0 到发布,几乎完全通过 Vibe Coding 完成——我只负责提需求和方向,Claude Code 负责写代码、调试、打包、发布 Release ,全程几乎不需要手动写一行代码。


    做了什么

    ClaudeTokenMonitorBar — 一个 macOS 原生菜单栏应用,实时监控 Claude Code 的 Token 用量和费用。

    菜单栏截图

    主要功能

    • 菜单栏实时显示 — 仿 iStat Menus 风格,活跃时显示输入/输出速率(↗↙),空闲时显示总费用
    • 详细统计面板 — 点开后显示总成本、Token 分项(输入/输出/缓存读取)
    • 项目成本排行 — TOP 5 项目费用,带进度条可视化
    • 最近记录 — 最新 5 条 API 调用,含模型、Token 数、费用、时间
    • 30 天趋势图 — 柱状图展示近 30 天每日成本
    • 设置面板 — 开机启动、刷新间隔、显示项开关、中英文切换
    • 零依赖 — 纯 Swift + SwiftUI ,直接读取 ~/.claude/projects 的 JSONL 文件,无需后台服务

    Vibe Coding 的过程

    整个开发过程大概是这样的:

    我说:做一个 macOS 菜单栏 app ,实时显示 Claude Code 的 token 用量 Claude Code 做:搭建 Xcode 项目、实现数据读取、设计 UI 、调试布局

    我说:菜单栏图标改成仿 iStat Menus 的双行速率显示 Claude Code 做:用 NSImage 手绘图标,实现缓存机制避免重复绘制

    我说:加一个设置面板,支持开机启动、刷新间隔、显示项开关 Claude Code 做:新建 AppSettings (@Observable 单例)和 SettingsView ,用 SMAppService 实现开机启动

    我说:增加英文支持,在设置里可以切换语言 Claude Code 做:设计 L10n 架构(@Observable 单例 + 字典),替换全部硬编码字符串,语言切换即时生效无需重启

    我说:打包成 DMG ,发布 GitHub Release Claude Code 做:xcodebuild 构建、hdiutil 打包、gh CLI 发布,一条命令搞定

    从提第一个需求到发布 v1.0.4 ,整个过程我写的代码量约等于零


    技术栈

    • 语言:Swift 5.9
    • 框架:SwiftUI + Charts + ServiceManagement
    • 架构:@Observable ( iOS 17 / macOS 14 新特性)
    • 最低系统:macOS 14.0 Sonoma
    • 数据源~/.claude/projects/**/*.jsonl( Claude Code 本地日志)

    下载 & 源码

    安装方式:下载 DMG → 拖入 Applications → 启动,菜单栏就会出现图标。


    对 Vibe Coding 的感受

    这次体验下来,Vibe Coding 最大的价值不是"写代码快",而是把我从大量我不熟悉的领域里解放出来

    • 我不熟悉 Xcode 项目结构 → Claude Code 直接搞定
    • 我不了解 macOS 菜单栏 API → Claude Code 知道用 MenuBarExtra
    • 我不会用 hdiutil 打 DMG → Claude Code 知道完整流程
    • 我不熟悉 gh CLI 发 Release → Claude Code 一步到位

    我只需要清楚地描述"我想要什么",技术细节全部交给 AI 。这对于想快速验证想法的独立开发者来说非常适合。

    当然也有局限:复杂的业务逻辑、性能优化、安全审计这些还是需要人来把关。但对于这类工具型小项目,Vibe Coding 的效率真的很高。


    如果你也在用 Claude Code ,欢迎试试这个工具,顺手给个 Star ⭐

    有问题或建议欢迎提 Issue 。

    目前尚无回复
    关于   ·   帮助文档   ·   自助推广系统   ·   博客   ·   API   ·   FAQ   ·   Solana   ·   1132 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 45ms · UTC 18:02 · PVG 02:02 · LAX 11:02 · JFK 14:02
    ♥ Do have faith in what you're doing.