Claude Code 实时可视化 Mod：Agent 改代码全过程不再黑盒

用 Claude Code 写代码的人，大概都有过这种感觉：你让它重构一个模块，它吭哧吭哧跑了几分钟，输出一堆文件修改，而你只能干等着，完全不知道它正在读哪个文件、改了哪一行、子 Agent 走到哪一步了。等整轮跑完才发现关键文件改错了，已经晚了。

原生 Claude Code 改代码，真的像个黑盒。

最近 Anthropic 开放了 Mods 能力（Claude Code 2.1.287+），社区立刻折腾出了真正实用的东西。今天重点推荐一个 开源项目：hamzafer/claude-code-mods。

它核心就做一件事——把 Agent 的读写和进度，实时摊在终端里给你看。

主要亮点

/mission 实时地图

• w 模式：看 Who——主 Agent、子 Agent、每一次工具调用，全部实时显示。
• c 模式：看 Code——文件关系图 + import 箭头，跨文件改造一眼就能看出依赖链。

颜色直观反馈

读取文件时蓝光，编辑时橙光，改完变绿并打勾，卡片下方还会给出一句改动原因。

/radar 子 Agent 雷达

每个子 Agent 单独一行：耗时、调用了多少工具、当前在干什么，清清楚楚。

以前像 「logout 改造」 这种会牵涉 login.ts → client.ts → session.ts → users.ts 的跨文件操作，现在不用等跑完才发现它走偏了。边跑边盯，及时打断或纠正，体验完全不一样。

特别适合做 重构 和 批量改代码 的场景。

快速上手

确认 Claude Code 版本 ≥ 2.1.287：

claude plugin marketplace add hamzafer/claude-code-mods
claude plugin install mission-control@claude-code-mods

重启 Claude Code 后输入 /mission 或 /mission code 即可。

注意：代码图（Code 视图）需要 Google Chrome + 支持显示图片的终端（Ghostty / kitty / iTerm2）。Who 视图则没有限制，任何终端都能用。

仓库地址： https://github.com/hamzafer/claude-code-mods

小结

Claude Code 开放 Mods 之后，社区已经开始真正把「可观测性」补上了。这个 mission-control 就是目前最实用的可视化方案之一。

如果你经常用 Claude Code 做复杂改造，强烈建议装上试试。黑盒变透明，效率和安全感都会明显提升。