🍊 UglyOrange
🛠️ 技术

Vibe Coding 终极指南:驾驭 GPT-5 与 Claude 4.5 的沉浸式开发工作流

frigidpluto Views: ...
Image

在 AI 辅助编程领域,单纯的代码生成已经不是新鲜事。现在的趋势是 “Vibe Coding” —— 一种更注重流畅度、自然语言交互(甚至语音交互)和宏观把控的开发方式。

本文基于 Nicolas Zullo 开源的 Vibe Coding V1.2 指南,结合 2025 年最新的工具生态(Claude Sonnet 4.5 和 GPT-5 Codex),为开发者拆解这套能够从零构建复杂游戏或应用的高效工作流。

核心理念:规划重于一切

很多开发者在使用 AI 时最大的误区是:让 AI 自己去规划。结果往往是代码越写越乱,写到最终完全不可维护。

Vibe Coding 的核心原则是:Planning is everything(规划决定一切)。开发者必须建立坚实的基础,通过文档约束 AI 的行为,而不是让它自由发挥。

工具准备

要开始 Vibe Coding,你需要以下任一工具的 CLI 版本(推荐)或 VSCode 扩展:

  1. Claude Code:搭载 Claude Sonnet 4.5 模型。
  2. Codex CLI:搭载 gpt-5-codex (high) 模型。

注意:虽然 Cursor 依然是王者,但在本工作流中,Claude Code 和 Codex CLI 提供了更强的终端集成能力、自定义命令(Custom Commands)以及对最新模型的原生支持,更适合这种以 CLI 为中心的开发模式。

第一阶段:构建项目大脑(Memory Bank)

不只是写代码,我们要给 AI 构建一个”外挂大脑”,通常称为 memory-bank。这是 Vibe Coding 区别于普通 AI 编程的关键。

1. 编写设计文档 (GDD/PRD)

不要直接开始写代码。首先,将你的想法告诉 AI,让它生成一份文档。

  • 游戏开发:生成 game-design-document.md (GDD)。
  • 应用开发:生成 product-requirements.md (PRD)。

要点:保持文档简洁但意图明确。这是 AI 理解项目愿景的基石。

2. 确定技术栈与规则

询问 AI:“基于我的设计文档,推荐最简单但最稳健(Robust)的技术栈”,将其保存为 tech-stack.md

然后,在终端运行 /init (Claude Code/Codex CLI)。这会初始化配置。最关键的一步是设置 “Always” 规则,强制 AI 在行动前读取上下文:

# IMPORTANT RULES (Add to .clauderc or equivalent)

# 1. 在编写任何代码前,必须阅读 memory-bank/@architecture.md
# 2. 在编写任何代码前,必须阅读 memory-bank/@game-design-document.md
# 3. 完成主要功能或里程碑后,必须更新 memory-bank/@architecture.md
# 4. 包含完整的数据库 Schema

3. 制定实施计划

让 AI 读取上述文档,生成 implementation-plan.md。这个计划必须包含:

  • 细颗粒度的步骤。
  • 每个步骤的验证测试(非常重要,没有测试就无法验证步骤是否完成)。
  • 不包含具体代码,只包含指令。

4. 组装 Memory Bank

在项目根目录下创建一个名为 memory-bank 的文件夹,确保存放以下文件:

文件名用途
game-design-document.md项目愿景与设计规范
tech-stack.md技术选型说明
implementation-plan.md逐步执行的路线图
progress.md动态更新:记录已完成的步骤
architecture.md动态更新:记录文件结构和架构决策

第二阶段:进入 Vibe 状态 (The Workflow)

到这一步,开发者就可以开始”指挥”AI 了。推荐安装 Superwhisper,通过语音直接与 AI 对话,体验真正的 Vibe。

1. 初始校准

启动 CLI 工具,提示:

“阅读 /memory-bank 中的所有文档。implementation-plan.md 清晰吗?为了确保你 100% 理解,请列出你的问题。”

回答 AI 的提问,并让它根据你的回答优化实施计划。

2. 循环开发 (The Loop)

这是日常开发的标准动作:

  1. 启动任务: “阅读 /memory-bank,执行实施计划的 Step 1。我会运行测试。在我验证测试通过前,不要开始 Step 2。验证通过后,更新 progress.mdarchitecture.md。”

  2. 计划模式 (Plan Mode): 在 Claude Code 中使用 Shift+Tab 进入计划模式。让 AI 先列出它打算修改哪些文件,确认无误后再执行。

  3. 验证与提交: 运行测试。如果通过,提交 Git (Commit)。

  4. 清理上下文: 使用 /clear/compact 清理上下文,防止 Token 溢出或注意力分散。

  5. 下一轮循环: “阅读 memory-bank,检查 progress.md 了解进度,现在开始 Step 2…”


第三阶段:进阶与排错

遇到 Bug 怎么办?

  • 回溯 (Rewind):Claude Code 提供了 /rewind 命令,可以将项目回滚到上一个状态,调整提示词后重试。
  • 懒人调试:安装 BrowserTools,让 AI 自动捕获浏览器控制台报错,省去复制粘贴的麻烦。
  • 全局求救:如果彻底卡住,使用 RepoPromptuithub 将整个代码库打包成一个 Prompt,询问 GPT-5 或 Claude “我哪里做错了”。

提升输出质量的技巧

  • 给予思考时间:在 Prompt 中加入 “Think as long as needed to get this right. I am not in a hurry.”(慢慢想,我不急)。
  • 触发深度推理:对 Claude Code 使用递进式指令:think -> think hard -> ultrathink。这会激活模型更深层的推理链。
  • 危险模式:如果你信任 AI,可以使用 --dangerously-skip-permissions (Claude) 或 --yolo (Codex) 启动,跳过繁琐的文件读写确认(仅建议在沙盒环境或有 Git 保护时使用)。

推荐工具箱

为了打造完整的产品体验,除了代码,你还需要这些 AI 工具:

  • 文案撰写:Claude Opus 4.1 (文笔最好)
  • 2D 素材/精灵图:ChatGPT + Nano Banana
  • 背景音乐:Suno
  • 音效设计:ElevenLabs
  • 视频生成:Sora 2

常见问题 (FAQ)

Q: 为什么不用 Cursor?

A: Cursor 依然很优秀,但 Claude Code/Codex CLI 提供了更纯粹的 “Agent” 体验。它们在终端运行,意味着开发者可以通过 SSH 在远程服务器开发,且它们对各自最新模型(Sonnet 4.5/GPT-5)的调用优化通常优于第三方集成的 Cursor。

Q: 对于复杂的 3D 效果,AI 总是写不好。

A: 不要试图用一个 Prompt 完成复杂功能。对于复杂组件(如飞机的副翼控制),创建一个单独的 feature-implementation.md,将其拆解为 30 个微步骤。细节在于拆解。

Q: 我不懂服务器配置怎么办?

A:tech-stack.md 阶段就问 AI。现在的 AI 能完美处理 Docker、Nginx 配置甚至是 K8s 部署脚本。


Vibe Coding 不仅仅是工具的叠加,它是一种相信 “AI 能够理解并执行结构化指令” 的信念。只要你的 memory-bank 足够清晰,AI 就能成为你最得力的架构师和工程师。