第三章:让 AI 先说清楚会改什么,再开始改

vibecoding入门教程

浏览 368 次


前两章你已经完成了两件事:知道 vibecoding 是什么,也知道 AI 编程助手的基本入口和常用操作。

这一章开始练最常用的 vibecoding 提示词。

注意:不要一上来就让 AI 编程助手改代码。
先让它读懂问题,写出计划,等你确认后再动手。

这句话很重要。你不需要先懂全部代码,但要先让 AI 把“准备做什么”说清楚。

学完这一章,你应该能做到:

  • 让 AI 编程助手先说明要改什么,不直接修改;
  • 让 AI 编程助手等你确认后再动手;
  • 限制 AI 编程助手只修改指定文件;
  • 要求 AI 编程助手按固定格式输出;
  • 当 AI 编程助手改多了,能用提示词让它暂停、总结、回到小范围修改。

如果还没有打开可用的 AI 编程工具,先按第一章从官网安装并完成第一个练习,再继续这一章。

本章可直接复制的提示词

你要做的事:让 AI 在改代码前先说清楚它准备做什么。

【可直接复制给 AI】

请先看当前项目,不要修改任何文件。
我的目标是:(写你的目标)

请先告诉我:
1. 你会先看哪些文件;
2. 你准备改哪些文件;
3. 每个文件准备改什么;
4. 有没有风险;
5. 我确认后你再开始修改。

【说明】

  • AI 会先给你修改清单;
  • 不会一上来乱改;
  • 你可以确认后再让它执行。

不满意继续这样问:

范围太大了。
请把回答改成三行:
1. 只改哪个文件;
2. 改完我会看到什么;
3. 我怎么验证。

3.1 想让 AI 改代码前,先复制这段

很多新手第一次用 AI 编程工具,最容易犯的错误不是“不会提问”,而是太快让它改代码。

比如你一上来就说:

帮我优化一下这个项目。

或者:

帮我把这个页面改好看一点。

AI 编程工具可能真的会开始改。

问题是,它不知道你说的“优化”到底是:

  • 改页面样式

  • 改代码结构

  • 改性能

  • 改 SEO

  • 改文案

  • 改接口

  • 改目录

  • 改依赖

结果很容易变成:

  • 本来只想改文案,它顺手改了组件结构

  • 本来只想修按钮,它重写了整个页面

  • 本来只想看报错,它直接动了配置文件

  • 本来只想问原因,它开始跑命令、改代码、删内容

所以这一章只练一件事:

怎么让 AI 先说清楚,再开始修改。

你可以直接【可直接复制给 AI】

请先看当前项目,不要修改任何文件。
我的目标是:(写你的目标)

请直接告诉我:
1. 你准备先看哪些文件;
2. 你准备修改哪些文件;
3. 每个文件准备改什么;
4. 改完以后我会看到什么效果;
5. 我应该怎么验证。

我确认后,你再开始修改。

【说明】AI 会先输出一份修改说明,而不是马上动代码。

如果它回复太长,【继续追问】

请不要展开讲原理。
把回答压缩成三项:
1. 改哪个文件;
2. 改完有什么效果;
3. 我怎么验证。


3.2 不知道从哪里开始时,这样问

这是每个新项目的第一步。

假设你刚打开一个陌生项目,里面有一堆文件:

src
app
components
package.json
README.md
next.config.js
tailwind.config.ts

你不知道它是 Next.js、React、Astro,还是别的项目。

很多人会直接问:

这个项目怎么用?

这样也能问,但不够稳。

更推荐这样问:

请先查看当前文件夹,不要修改任何文件。

请用中文告诉我:

1. 我应该先打开哪个文件;
2. 我应该输入什么命令运行;
3. 如果运行失败,我应该复制哪段报错给你;
4. 如果我要改一个小功能,应该先告诉你哪些信息。

这一轮只告诉我下一步动作,不要修改代码。

【说明】

  • AI 会告诉你先打开哪个文件;
  • 给你一条可以复制的启动命令;
  • 告诉你失败时复制哪段红字。

在你选用的 AI 编程工具对话框里粘贴上面的提示词。不同工具的命令行入口各不相同,入门阶段先用图形界面。


AI 编程工具可能会看哪些文件

它通常会优先看:

package.json
README.md
src/
app/
pages/
components/
next.config.js
astro.config.mjs
vite.config.ts
tsconfig.json

如果是 Python 项目,可能会看:

pyproject.toml
requirements.txt
main.py
app.py

如果是 Go 项目,可能会看:

go.mod
main.go
cmd/
internal/

你应该怎么验收

AI 编程工具回复后,你要检查它有没有说清楚:

  • 项目类型

  • 启动命令

  • 构建命令

  • 主要目录

  • 下一步建议

如果它连项目类型都判断错,说明它可能没读对目录。

这时候不要继续让它改代码。

先在终端确认目录:

pwd
ls

Windows PowerShell:

pwd
dir

翻车点

不要这样问:

帮我看看这个项目,然后优化一下。

这句话太宽。

AI 编程工具可能会边看边改。

更好的方式是分两步:

第一步:只读项目,不修改。
第二步:给我建议,不执行。


3.3 案例二:先写计划,不要直接动手

当你已经知道当前文件夹后,下一步不是马上让 AI 编程工具改,而是让它先写计划。

比如你想让它修一个首页问题。

不要直接说:

帮我修复首页按钮没反应的问题。

更稳的说法是:

目标:修复首页按钮点击没有反应的问题。

请先看当前项目,不要修改任何文件。

请你先完成这几件事:

1. 判断这个问题可能和哪些文件有关
2. 说明你准备先查看哪些文件
3. 给出 2-3 个可能原因
4. 给出修复计划
5. 等我确认后,再开始修改

限制:
- 不要重构无关代码
- 不要修改样式,除非问题确实和样式有关
- 不要新增依赖

这条提示词的核心是:

先计划,再确认,再修改。

它会把 AI 编程工具从“自动干活模式”拉回“工程师汇报模式”。


AI 编程工具可能会怎么回复

它可能会说:

我会先查看以下文件:

1. src/app/page.tsx
2. src/components/Hero.tsx
3. src/components/Button.tsx
4. package.json

可能原因包括:

1. 按钮没有绑定 onClick
2. 事件被父元素阻止
3. 按钮被 disabled 状态覆盖
4. 路由跳转函数没有正确调用

这种回复就比较安全。

因为它还没有动代码。

你可以【继续追问】

可以,先只查看这些文件,不要修改。

或者:

先看 @src/components/Hero.tsx,不要看其他文件。

什么时候可以让它开始改

当它的计划合理时,再输入:

可以,按这个计划修改。

要求:
1. 只修改你刚才提到的相关文件
2. 不要改无关样式
3. 修改完成后总结改了哪些文件
4. 告诉我怎么验证

这样 AI 编程工具才开始真正动手。


翻车点

不要让 AI 编程工具同时做太多事情。

错误示例:

帮我修按钮,顺便优化样式,再帮我整理组件结构,最后把 SEO 也改了。

这会导致任务范围爆炸。

正确做法:

这次只修按钮点击问题。
其他优化先不要做。


3.4 案例三:只允许改两个文件

这是新手必须学会的一招。

很多时候,你只想让 AI 编程工具改一个页面,但它可能会顺手改:

组件
样式
数据文件
配置文件
README
测试文件
依赖版本

这不一定是坏事,但新手很难判断哪些改动合理。

所以要学会限制修改范围。

假设你只想改首页首屏文案,可以这样说:

目标:优化首页首屏文案,让标题更有吸引力,副标题更清楚。

允许修改:
- src/app/page.tsx
- src/components/Hero.tsx

禁止修改:
- package.json
- next.config.js
- tailwind.config.ts
- 任何 API 文件
- 任何数据结构
- 任何依赖版本

要求:
1. 只改文案,不改业务逻辑
2. 不改布局结构
3. 不新增依赖
4. 修改前先告诉我准备改哪几句话
5. 我确认后再执行

这条提示词非常适合前端小改。


AI 编程工具看到限制后应该怎么做

理想情况下,它应该先回复:

我准备只修改以下内容:

1. Hero 标题
2. Hero 副标题
3. CTA 按钮文案

不会修改布局、依赖、配置文件。

如果它说要改很多文件,你就要拦住它:

范围太大了。请重新计划,只允许修改 src/components/Hero.tsx。

修改后一定要检查

AI 编程工具改完后,你要运行:

git diff

查看它到底改了哪些文件。

如果只允许改 2 个文件,但它改了 5 个文件,要立刻问:

你修改了我没有授权的文件。请说明为什么,并给出如何回滚这些无关修改。

或者直接回滚无关文件:

git restore 文件名

翻车点

不要只说:

只改一点点。

AI 编程工具不知道“一点点”是多少。

要具体说:

只允许修改 src/components/Hero.tsx。

不要说:

不要乱改。

要说:

禁止修改 package.json、配置文件、API 文件和依赖版本。


3.5 案例四:让 AI 编程工具按你的格式输出

AI 编程工具有时候会写很多解释,新手看着很累。

你可以要求它按固定格式输出。

比如你只是想让它分析一个报错,不想看长篇大论,可以这样写:

请分析下面这个报错。

输出格式必须是:

1. 最可能原因:
2. 相关文件:
3. 需要确认的信息:
4. 建议修复步骤:
5. 暂时不要修改文件的原因:

要求:
- 不要直接修改任何文件
- 不要输出超过 500 字
- 如果信息不够,请告诉我还需要哪些日志

这样 AI 编程工具的回复会更可控。


适合新手的输出格式

如果是分析项目:

请按这个格式输出:

1. 项目类型:
2. 技术栈:
3. 启动命令:
4. 构建命令:
5. 关键目录:
6. 下一步建议:

如果是修 bug:

请按这个格式输出:

1. 问题现象:
2. 可能原因:
3. 需要查看的文件:
4. 修改计划:
5. 风险点:
6. 验证方式:

如果是改页面:

请按这个格式输出:

1. 准备修改的区域:
2. 准备修改的文件:
3. 不会修改的内容:
4. 修改后的预期效果:
5. 需要我确认的问题:

如果是审查 diff:

请按这个格式输出:

1. 改动摘要:
2. 风险文件:
3. 可能 bug:
4. 无关修改:
5. 是否建议提交:
6. 提交前验证命令:

为什么格式很重要

固定格式有几个好处:

  • 方便飞书复制

  • 方便自己检查

  • 方便后续继续追问

  • 不容易漏掉验证方式

  • 不容易让 AI 编程工具长篇发挥

  • 适合新手判断结果是否靠谱


翻车点

不要让 AI 编程工具一边分析一边修改。

错误写法:

帮我分析并修复这个问题。

更好的写法:

先只分析,不要修改。
按固定格式输出。


3.6 案例五:AI 编程工具改歪了,怎么拉回来

这是最真实的场景。

你让 AI 编程工具改一个小功能,结果它改多了。

比如你本来只想改按钮文案,它却顺手改了布局。

这时候不要继续追着它说:

你再改回来。

这样可能越改越乱。

正确做法是先停下来。


第一步:停止继续修改

直接输入:

暂停。

不要继续修改任何文件。

请先总结你刚才已经修改了哪些文件,每个文件改了什么。

第二步:让它解释为什么改这些文件

继续输入:

请说明每个改动是否和我的原始需求直接相关。

请按这个格式输出:

文件:
改动内容:
是否必要:
如果不必要,如何回滚:

第三步:查看 git diff

在终端运行:

git diff

或者在 IDE 的 Source Control 面板中查看。

重点检查:

  • 是否改了无关文件

  • 是否删了原有逻辑

  • 是否新增了不必要依赖

  • 是否改了配置文件

  • 是否改了 API

  • 是否硬编码了敏感信息


第四步:只回滚无关部分

如果确定某个文件不该改,可以回滚:

git restore 文件名

例如:

git restore package.json

如果要回滚所有未提交修改:

git restore .

注意:

这会撤销所有未提交修改。

一定要确认没有重要内容。


第五步:重新下达更窄的任务

回滚后,不要继续用原来的大任务。

改成更窄的提示词:

重新开始。

这次只允许修改 src/components/Hero.tsx。

目标:只修改按钮文案,把“开始使用”改成“免费体验”。

禁止:
- 不改布局
- 不改样式
- 不改其他组件
- 不改 package.json
- 不新增依赖

修改完成后,请总结 diff。

翻车点

不要这样处理:

你刚才改错了,重新改好。

这句话还是太宽。

AI 编程工具可能不知道哪里错了,于是继续大范围修改。

更好的方式是:

暂停。
总结已改文件。
判断哪些不必要。
我确认后再回滚。


3.7 本章通用提示词模板

下面这几个模板可以直接复制使用。


模板一:只读项目

请先阅读当前当前文件夹,不要修改任何文件。

请用中文告诉我:
1. 项目技术栈
2. 主要目录作用
3. 启动命令
4. 构建命令
5. 后续开发建议

注意:只分析,不修改,不执行高风险命令。

模板二:先计划再修改

目标:{写清楚你要做什么}

请先看当前项目,不要修改任何文件。

请先输出:
1. 你准备查看哪些文件
2. 可能原因或实现方案
3. 具体修改计划
4. 风险点
5. 验证方式

等我确认后,再开始修改。

模板三:限制修改范围

目标:{写清楚任务}

允许修改:
- {文件1}
- {文件2}

禁止修改:
- package.json
- 配置文件
- API 文件
- 依赖版本
- 无关组件

要求:
1. 修改前先说明计划
2. 只改授权文件
3. 不新增依赖
4. 修改后总结 diff
5. 告诉我验证方式

模板四:固定格式分析报错

请分析下面这个报错。

输出格式:
1. 最可能原因:
2. 相关文件:
3. 需要确认的信息:
4. 建议修复步骤:
5. 验证方式:

要求:
- 先不要修改文件
- 不要猜测没有证据的原因
- 如果信息不够,请告诉我还需要什么日志

模板五:AI 编程工具改歪后暂停

暂停。

不要继续修改任何文件。

请总结你刚才已经修改了哪些文件,并按这个格式输出:

文件:
改动内容:
是否和原始需求直接相关:
如果不相关,建议如何回滚:

我确认后,再决定下一步。

3.8 本章总结

这一章你需要记住五句话。

第一句:

先分析,不修改。

第二句:

先写计划,等我确认。

第三句:

只允许修改这些文件。

第四句:

按固定格式输出。

第五句:

暂停,先总结已改内容。

新手使用 AI 编程工具,不要追求“一句话改完整个项目”。

真正稳定的方式是:

只读分析
先说清楚再修改
限制范围
确认修改
查看 diff
运行验证
总结结果

只要你掌握这个流程,AI 编程工具就不会像一个乱跑的自动脚本,而会更像一个听指令的开发助手。

下一章可以继续讲:

接手一个陌生项目时,如何让 AI 编程工具帮你从 0 看懂当前文件夹、启动方式和风险点。