Vibe Coding 时代，你更需要 Git Graph
AI 帮你写代码是爽，但你真的知道它改了什么吗？
先聊聊 Vibe Coding
2025年2月，OpenAI 联合创始人、前特斯拉 AI 负责人 Andrej Karpathy 发了一条推文：
"There's a new kind of coding I call 'vibe coding', where you fully give in to the vibes, embrace exponentials, and forget that the code even exists."
翻译过来就是：一种全新的编程方式，你只管描述想要什么，AI 来写代码，你甚至可以忘记代码本身的存在。
后来 Collins 字典直接把 "Vibe Coding" 评为了 2025 年度词汇。
现在是 2026 年，vibe coding 早就不是什么新鲜事了。GitHub 的调查显示，82% 的开发者正在使用或计划使用 AI 编程工具，41% 的代码是 AI 生成的。
Cursor、Claude Code、Copilot、Windsurf…… 你随便挑一个，都能让你体验到"说人话就能写代码"的快感。
但问题来了。
Vibe Coding 的爽，和它的痛
Vibe coding 的核心体验是：快。
你跟 AI 说"帮我加一个用户登录功能"，几秒钟代码就出来了。你说"把这个组件重构成 Hooks 写法"，刷一下就改好了。
但这种快是有代价的：
- 你不知道 AI 到底改了什么。 一次对话下来，AI 可能改了十几个文件，你不可能逐行审查。
- commit 历史变得混乱。 AI 一次改一堆东西，你的提交记录很快就变成一团浆糊。
- 分支越来越多。 你让 AI 试方案 A，不行，又试方案 B，分支长得像蜘蛛网。
- 出了 bug 你不知道是哪次改动引入的。 以前你自己写的代码，出了问题你大概有印象。AI 写的？完全没头绪。
Simon Willison（Django 联合创始人）说得很好：
"Vibe coding 是让 AI 写代码而你不看。但专业开发不一样，你需要 review、需要验证、需要理解发生了什么。"
这就是 Git Graph 的价值所在。
Git Graph：Vibe Coding 时代的"上帝视角"
Git Graph 是一个 VS Code 插件，1400 万+ 安装量。它做的事情很简单：在 VS Code 里画一张好看的、可交互的 Git 提交历史图。
但在 vibe coding 的语境下，它的价值远不止"好看"。
1. 让 AI 的每次改动都"可见"
Vibe coding 最大的问题就是黑盒感。AI 帮你改了一堆东西，你只知道结果，不知道过程。
打开 Git Graph，你能看到：
- 每个 commit 改了哪些文件
- 具体的代码 diff
- 这个 commit 是在哪个分支上、由谁（AI 还是你）提交的
把黑盒变成白盒，这是 vibe coding 的第一步。
2. 对比两个 commit，搞清楚"到底改了啥"
这是我用得最多的功能。
按住 Ctrl（Mac 是 Cmd），点两个 commit，就能看到这两个版本之间的所有差异。
什么场景？
- 你让 AI 重构了一个模块，想看看它到底改了什么 → 选重构前后的两个 commit 对比
- 跑测试挂了，想定位是哪次改动引入的 → 二分法选 commit 对比
- 要给同事解释"这个功能是怎么实现的" → 直接选分叉点和最新 commit 对比
在 vibe coding 的工作流里，这个功能基本每次都会用到。
3. 分支管理：从蜘蛛网到清晰地图
Vibe coding 的一个典型模式是：
"AI，帮我试试方案 A" → 新建分支
"不行，换方案 B" → 又新建分支
"还是方案 A 好，但要改一下" → 切回方案 A 的分支
"合并一下" → merge
几轮下来，你的分支图就变成了这样：
main ──●──●──●──●──●──●──●──●──●──
\ / \ /
feature-A ●──● ●──●
\ /
feature-B ●──●──●
在终端里看 git log --graph？眼睛都要瞎了。
在 Git Graph 里？不同颜色的线，一目了然。哪个分支从哪里分出来的，合并到了哪里，清清楚楚。
4. 右键操作：不用记命令
Vibe coding 的精髓是"忘记代码"，那 Git Graph 的精髓就是**"忘记命令"**。
在 commit 上右键：
- Cherry Pick —— 把这个 commit 摘到当前分支
- Revert —— 撤销这个 commit
- Create Branch —— 从这里开新分支
- Reset —— 回退到这个版本
在分支名上右键：
- Checkout / Merge / Rebase / Delete —— 该有的都有
以前在终端里要打好几行命令的操作，现在右键点一下就搞定了。
5. 搜索：在海量 commit 里找到你想要的
Vibe coding 一个 session 下来，可能产生几十个 commit。你想找到"上次 AI 加的那个登录功能是在哪个 commit"，靠滚动是不现实的。
在 Git Graph 界面按 Ctrl+F，可以搜索 commit 信息、作者、hash。
按 Ctrl+H 快速跳转到 HEAD。
按 Ctrl+S 跳转到最近的 stash。
我的 Vibe Coding + Git Graph 工作流
分享一下我实际是怎么配合使用的：
第一步：开始一个任务
先在 Git Graph 里确认当前分支状态，确保工作区干净。
第二步：让 AI 干活
跟 AI 对话，让它帮你写功能、重构代码、修 bug。一顿操作猛如虎。
第三步：阶段性提交
AI 改了一轮之后，先别急着继续。打开 Git Graph：
- 看看它改了哪些文件
- 用 diff 确认改动是否合理
- 没问题就 commit，有问题就让 AI 重来
第四步：分支实验
想试不同方案？开新分支。不行就切回来。Git Graph 上看得清清楚楚。
第五步：合并和清理
功能做完，Git Graph 上确认分支状态，合并到主分支，删除废弃分支。
核心原则：AI 负责写，你负责看。Git Graph 就是你的"看"的工具。
进阶配置推荐
Git Graph 有很多可以自定义的地方，这里推荐几个最值得改的设置：
自定义分支筛选
"git-graph.customBranchGlobPatterns": [
{"name": "功能分支", "glob": "heads/feature/*"},
{"name": "修复分支", "glob": "heads/fix/*"},
{"name": "远程主分支", "glob": "remotes/origin/main"}
]
Vibe coding 分支多，这个配置能帮你快速筛选。
Emoji 标记 commit
Git Graph 支持自动把 emoji shortcode 转换成真正的 emoji：
"git-graph.customEmojiShortcodeMappings": [
{"shortcode": ":sparkles:", "emoji": "✨"},
{"shortcode": ":bug:", "emoji": "🐛"},
{"shortcode": ":recycle:", "emoji": "♻️"}
]
用 emoji 标记 commit 类型，一眼就能看出哪个是新功能、哪个是修 bug、哪个是重构。
启用头像显示
"git-graph.repository.commits.fetchAvatars": true
在多人协作的项目里，能直观区分哪些是你提交的，哪些是 AI 生成的。
调整图的样式
"git-graph.graph.style": "angular",
"git-graph.graph.colours": ["#0098ff", "#ff6b6b", "#51cf66", "#fcc419"]
你可能不知道的几个功能
导出配置给团队共享
在 Git Graph 界面右上角的菜单里，Export Repository Config 可以把你的配置导出，提交到仓库里。团队其他人打开同一个仓库，自动使用相同的配置。
集成 Pull Request
在分支上右键，选择 Create Pull Request，会自动跳转到 GitHub/GitLab 的 PR 创建页面。
Commit 信息支持 Markdown
Git Graph 会自动解析 commit 信息里的加粗、斜体、行内代码等 Markdown 格式。
快捷键速查
| 快捷键 | 功能 |
|---|---|
Ctrl+F | 搜索 commit |
Ctrl+H | 跳转到 HEAD |
Ctrl+R | 刷新视图 |
Ctrl+S | 跳转到下一个 stash |
Ctrl+Shift+S | 跳转到上一个 stash |
↑/↓ | 上下切换 commit |
写在最后
Vibe coding 的本质是把写代码的工作交给 AI，把思考和决策留给自己。
但"决策"的前提是"看见"。你需要知道 AI 做了什么，才能判断它做得对不对。
Git Graph 就是那个帮你"看见"的工具。
它不是要替代 SourceTree、GitKraken 这些重型 Git 客户端，而是在 VS Code 里提供一个轻量但够用的可视化方案。
在 vibe coding 时代，它从"锦上添花"变成了"不可或缺"。
AI 帮你写代码，Git Graph 帮你看代码。
这才是正确的 vibe coding 姿势。
💡 VS Code 现在也内置了 Source Control Graph 视图（在左侧源代码管理面板里），功能相对基础但也在快速迭代。如果你不想装插件，也可以先试试内置的。
📌 Git Graph 的更新历史和完整文档：GitHub - mhutchie/vscode-git-graph
