← 返回🔄Vibecoding 项目如何持续迭代
1 / 8
1
STEP 1

选对工具——从原型工具迁移到 IDE

很多人第一次做 Vibecoding 项目用的是 Lovable、Google Labs 这类工具。这些工具做原型很快,但有一个致命缺陷:你的代码被锁在平台里,看不到完整的文件结构,没办法做精细控制,功能一多就容易乱。

它们本来就不是为「持续开发」设计的,适合快速验证想法。

如果你想把项目真正做起来、持续改进、加功能、修 bug,就必须用更专业的工具——IDE(集成开发环境)

主流的 AI IDE 有:

  • Cursor(最推荐)
  • Trae(国产,中文友好)
  • VSCode + AI 插件

这类工具的核心优势:能看到所有文件,能和 AI 深度协作,而且能方便地做版本管理。

选对工具——从原型工具迁移到 IDE
2
STEP 2

认识你的 IDE 工作区

打开 Cursor,快速认识一下基本布局:

  • 左侧:AI 对话框,你和 AI 主要交互的地方,可以在这里提出需求、和 AI 对话
  • 中间:文件编辑窗口,写代码和写文档的地方,相当于一个编辑器
  • 右侧:文件目录。一个应用是几百甚至几千个文件互相协同的结果,每个项目都有一个文件目录
  • 下方:命令行工具输入窗口

不同工具布局可能略有差异,但基本功能都差不多:AI 对话窗口、文件编辑区、目录窗口和命令行工具。

认识你的 IDE 工作区
3
STEP 3

区分大改和小改

迭代分两种情况,处理方式完全不同:

小改:改个按钮颜色、调整文字、换个图标 → 直接截图 + 文字描述给 AI,改完看效果,不满意再改,简单直接,不需要走流程

大改:新增一个页面、重构核心功能、引入新模块 → 必须走完整流程,不能直接上手

大多数你能想到的新功能迭代,基本都属于大改。

接下来的步骤,就是专门针对「大改」的完整流程。

区分大改和小改
4
STEP 4

第一步:存档——迭代前先打包备份

就像打游戏要打大 Boss 之前先存档,做开发也一样。在大版本迭代之前,先做一次存档,防止翻车。

在 Cursor 的 AI 对话框里直接说:

我将要进行一次较大版本的迭代,帮我把整个项目打包存档

Cursor 会自动把当前项目打包备份到本地。这样即使迭代出了问题,也可以随时恢复。

如果你熟悉 Git,也可以用 git commit 做版本快照,效果更专业。但对新手来说,打包存档已经足够用了。

第一步:存档——迭代前先打包备份
5
STEP 5

第二步:写迭代文档(PRD + 页面 Demo)

别急着写代码,先让 AI 帮你把这次迭代想清楚。

找一个逻辑能力最强的大模型(推荐 Claude Opus),给它以下内容:

  1. 你当前网站/产品的截图
  2. 你要做什么迭代的描述

示例提示词:

下面是我目前的个人网站,目前的基本功能是上传教程,用户可以在主页进行查看。

现在我准备进行迭代,帮我写一个迭代文档 PRD,以及设计一下相关页面:
1、将右上角的 Tab 做成可用的状态(目前不可用),功能包括:AI 工具导航、项目展示、联系方式
2、做一个访客统计和访客点赞功能

所有功能需要有 PRD 和页面 Demo(HTML 格式)

Claude 会生成:

  • PRD 文档:包含功能需求、交互逻辑、数据结构
  • 页面 Demo:HTML 格式的视觉参考

仔细阅读生成结果,看是否和预期相符。如果某个地方不对,直接告诉它修改,直到你满意为止。

第二步:写迭代文档(PRD + 页面 Demo)
6
STEP 6

第三步:在 Cursor 中建立文档结构

确认文档和 Demo 都没问题后,回到 Cursor,按照以下结构创建文件:

项目根目录/
└── PRDs/
    └── v2.0/
        ├── v2.0.md        ← 粘贴 PRD 文档内容
        └── v2.0-demo.html ← 粘贴 Demo HTML 内容

操作步骤:

  1. 在项目根目录新建文件夹,命名 PRDs
  2. PRDs 里新建子文件夹,命名 v2.0(或你的版本号)
  3. 新建 v2.0.md,把 PRD 内容粘贴进去
  4. 新建 v2.0-demo.html,把 Demo HTML 粘贴进去

然后右键点击 v2.0 文件夹 → 添加到对话窗口,让 Cursor 读取这两个文件。

对 Cursor 说:

仔细阅读 v2.0 文件夹内的迭代文档和 demo,告诉我你对这次迭代的理解

确认 Cursor 理解正确后,再进入下一步。

第三步:在 Cursor 中建立文档结构
7
STEP 7

第四步:进入 Plan 模式开发

Cursor 理解迭代内容后,在对话窗口下方找到 Agent 标志,点击切换到 Plan 模式

然后对 Cursor 说:

建立开发计划,完成这次迭代

Cursor 会:

  1. 自动分析需要修改哪些文件、新增哪些功能
  2. 列出一份完整的开发计划(Todo List)
  3. 等待你确认后,点击 Build 开始自动开发

等 Cursor 开发完毕后,打开本地预览验证功能是否正常。不符合预期的地方,继续在对话中描述问题,让它修复。

第四步:进入 Plan 模式开发
8
STEP 8

最后:整理本次迭代改动清单

开发完成后,最后一步:让 AI 整理一份改动记录,方便下次迭代时快速了解项目现状。

直接用这个提示词:

本次迭代开发已完成,请帮我整理一份简洁的改动清单,
包括:修改了哪些文件、新增了哪些功能、有哪些需要注意的地方。
格式:Markdown,追加到 v2.0.md 文档末尾

为什么要做这一步?

AI 的记忆有上下文限制,尤其是编程 AI,上下文压缩频率非常高。如果你之后要做新的迭代,直接让 AI 阅读这个 PRDs/v2.0/ 文件夹,它就能快速了解目前的项目状态,不需要重新解释背景。

每次大版本迭代都重复这个流程,无论迭代到第 10 个版本,都不会翻车。

最后:整理本次迭代改动清单
1 / 8