本文创作于2026年6月16日，AI技术迭代迅速，请注意内容的时效性！

本教程基于IDE：Visual Studio Code，Coding Agent：Claude Code，其他的开发环境或插件可酌情参考本教程

教程分为四章，您可以根据您的知识储备和实践经验，选择性地阅读或跳过本教程的任何步骤，推荐有经验者或专家直接阅读附录，下面是教程目录：

---

一、环境配置

二、需求分析

三、开始Vibe coding

四、版本管理(回档)和错误修复

附录：本教程核心步骤和提示词

---

一、环境配置：

1.Node.js的安装

前往Node.js的官网下载并安装Node.js

官网看起来应该是这样的：

2.IDE的安装及配置中文包

前往Visual Studio Code官网下载并安装

官网看起来应该是这样的：

安装好后我们打开它，您会发现它是全英文界面，我们需要同时按下 Ctrl+Shift+X 这三个快捷键，或跟随图示，打开IDE的扩展商店

搜索 Chinese (Simplified) 等字样，安装如下图所示的中文语言包

重启您的IDE即可看到语言包已应用

3.安装git

我们需要使用git进行版本管理，就像游戏需要存档点一样，每当我们通过一关(完成一个小功能模块)，就需要进行存档，以免AI把项目改坏无法还原，您无需担心对git不熟悉，之后的一切操作都可以使用自然语言让AI为您完成

进入git官网，点击 Install for Windows 进行安装

官网看起来应该是这样的：

4.安装Claude Code扩展，并配置第三方API

在上一步提到的扩展商店里搜索Claude Code for VS Code，安装如图所示的插件

注：若您有能力和财力使用Claude 官方的API，以下步骤可跳过

随后我们需要为它配置第三方的大模型API，本教程以DeepSeek为例，

我们先进入DeepSeek官网，进入“API开放平台页面”，填写必要信息并充值一定的金额，例如10￥，便于我们后续使用

完成后我们打开API Keys界面，申请一个API密钥，名称可自定义，例如我们可以写Claude Code，便于我们后期识别，保管好您的API密钥，您可以近似理解这就是您的银行卡密码，如果泄露，他人可凭您的密钥随意使用您账户中充值的余额！

现在，我们需要修改Claude Code的配置，使其使用我们自定义的大模型

我们打开Windows资源管理器

进入您账户的根目录，如 C:\Users\您的实际用户名

或者在资源管理器的地址栏输入 %USERPROFILE%

进入 .claude 文件夹，如果您看不见，需要您打开资源管理器的“显示隐藏文件或文件夹的属性”

进入后，编辑目录里面的 settings.json 文件，若没有，请您手动创建，注意在下面 “ANTHROPIC_AUTH_TOKEN" 一栏内填写上您在上一个步骤申请的API Key，它大致长这样：sk-123456abcdxxxxx......

{
  "env": {
    "ANTHROPIC_BASE_URL": "https://api.deepseek.com/anthropic",
    "ANTHROPIC_AUTH_TOKEN": "在这个双引号内填写您在的上一个步骤申请的APIKey例如sk-123456abcd什么的",
    "ANTHROPIC_MODEL": "deepseek-v4-pro[1m]",
    "ANTHROPIC_DEFAULT_OPUS_MODEL": "deepseek-v4-pro[1m]",
    "ANTHROPIC_DEFAULT_SONNET_MODEL": "deepseek-v4-pro[1m]",
    "ANTHROPIC_DEFAULT_HAIKU_MODEL": "deepseek-v4-pro[1m]",
    "CLAUDE_CODE_DISABLE_NONESSENTIAL_TRAFFIC": "1",
    "CLAUDE_CODE_EFFORT_LEVEL": "max"
  }
}

以上配置内指定使用 deepseek-v4-pro[1m] 模型，您可以根据实际需要自行修改为其他

5.安装本地数据库

由于此项网络上的教程较多，所以不再过多赘述（其实就是懒

您可能会用到的MySQL登录命令格式为：

mysql -u用户名 -p密码

注意：-u、-p的后面没有跟空格！

例如您配置的数据库账户名是root，密码是114514，那么您的登录命令即为

mysql -uroot -p114514

牢记您的账号和密码，在后续Vibe coding的过程中，您可以主动告诉它，以便它帮您导入SQL文件

至此，环境配置完成！

二、需求分析

不要直接说“帮我写一个项目”许多人对Vibe coding的认识停留在“给我做一个后台管理系统”，然后就期待AI完成一切

AI不是这么用的，正如我们古法编程一样，我们想做一个项目，首要步骤是进行 需求分析 ，这点十分重要，您想做一个什么东西，它的具体功能是有哪些，会用到哪些技术栈

否则，您就像一个完全不懂技术只做人事管理的领导，直接对核心技术员指指点点一样强人所难

---

我们现在以一个商品库存管理系统为例

先做需求分析，我们是不是需要后端和前端，后端基于SpringBoot如何？前端的话，考虑易用性，我们可以选择Vue3，既然是商品信息管理，那么我们肯定还需要一个数据库，用于存放商品数据

有点费劲？别怕，我们可以借助AI来分析我们的需求，提示词可参考下图

以下是需求分析完成后的提示词示例：

---

我需要做一个商品库存管理系统，主要用于企业、商店或仓库对商品信息、供应商信息、仓库库存、入库出库、库存盘点、库存调拨、库存预警和数据统计进行统一管理。

具体要求：

1、项目结构

（1）合理设计项目结构

（2）项目要求包括前台和后台模块，至少10个功能模块

（3）SQL文件单独存放在文件夹中

（4）系统采用前后端分离架构

2、技术规范

（1）使用SpringBoot框架，确保项目后端能够实现与前端的交互；

（2）利用MyBatis-plus进行数据库操作，确保数据的增删改查功能正常；

（3）使用SpringMVC模式，设计好Controller、Service、Repository等层次结构；

（4）前端采用Vue3，确保页面展示效果良好；

---

三、开始Vibe coding

看来您已经充分了解您的需求了，现在，让我们开始愉快地Vibe coding吧！

您需要新建一个文件夹作为您的项目文件夹，建一个吧，文件夹名字尽量只使用英文字符

现在，让我们打开IDE，然后打开您刚刚创建的项目文件夹，具体操作步骤如下

点击 VS Code 左上角的 “文件” (File) 菜单。
选择 “打开文件夹...” (Open Folder...)。
找到您的项目文件夹并选中，点击确认

现在您的IDE应该是这样的

可以注意到您的菜单栏和预览页上有如下Claude Code按钮，我们打开它，点击

我们需要使用git初始化这个项目文件夹，您可以直接使用如下提示词

请使用git初始化此项目文件夹

您可能会遇到如下的对话框：

我们之后的过程中会遇到很多像这样的授权过程 ，您需要简单审核，确认没问题之后，点击 Yes ，进行授权，或点击Yes，allow xx xxxxx...... 选择对同类型的命令自动授权(安全性稍低)

现在您的项目就被git管理起来了，您可以在项目文件夹内看到.git、.gitignore这一类的文件，请您不要删除

现在，我们正式开始使用Claude Code进行开发

首先我们需要它调整为Plan Mode(计划模式)

请您在您刚刚整理的需求后面，添加如下文字：

我暂时就这些想法，你帮我整理一下我的需求，如果你有不确定的地方可以问我，我们先沟通项目需求，等我确认以后再做下一步执行

整理合并后就变为了：

---

---

请完整复制后发送给Claude Code

它会询问您一系列的问题，您可以直接选择(推荐)，也可在Other对话框中输入您的想法

直到它把您的需求整理完毕，如图所示

现在请您注意：当它询问您是否执行计划时，先不要忙着让它执行，请您一次性输入下面的全部提示词：

你需要规划开发步骤,不要一口气做太多,让项目稳定安全有效的推进。 
在项目文件夹内创建开发日志文件夹，按照y-m-d-hm的时间格式自动记录完成的开发事项和待办事项。 
再创建一个docs文件夹,放入项目开发相关的开发需求、技术、设计规范, 执行步骤等等具体标准文件。在你的AGENTS.md(首次需要你创建)文件中添加指引各项标准文件路径以及工作说明 ，项目使用git版本管理，每完成一个独立且可运行的逻辑单元，需要进行Git 提交，随后等待我的下一步指令

随后我们即可开始让它写代码啦！您只需要玩手机，然后点击Yes即可，等待它完成一个小功能

有了前面约定的开发规范，现在每当它完成一个小模块，会停下来询问您是否继续，切记此时不要继续，因为上下文过长会造成模型降智、出现幻觉等问题，代码极易出错，我们需要点击

请你查看项目结构，完整阅读开发规范和当前开发进度，严格按照规范的开发步骤继续完成开发，你可以从AGENTS.md开始看起

随后它会自动读取开发计划，完成下一项开发步骤，开发完成后以此类推重复此步骤(开启新对话再开发下一个模块)

就像这样，直到AI执行完所有步骤，您就可以自行测试验证了

四、版本管理(回档)和错误修复

AI开发不太可能出错，但不出错不太可能（笑

有时候我们需要撤销某一个开发步骤的更改，让AI重新生成，这时候我们就会用到git了

可以看到有很多的提交(存档点)：

我们把光标移动到想要回档的提交(存档点)上，我们可以发现右边有一串哈希(ad8b798，它只显示前几位，实际很长），我们点击复制，得到如下的哈希值

ad8b798a66550e8d4ba83e73caf9af848807e9bc

现在我们打开Claude Code，开启一个新对话，输入如下的提示词(二选一)，填入您要回档的哈希，即可回档，但请您注意，回档分两种方式，强烈建议您补充git基础概念后再使用，以免不小心丢失您的提交

永久回退 (会丢弃那个存档点之后的一切存档)

请你把项目永久回退到 [哈希]，丢弃那个点之后的所有提交。

---

修改历史的某个提交 (您在这个存档点修改的文件，会自动应用在此存档之后的所有存档中，若文件有冲突会提示)

请你把项目停在 [哈希] 这个提交，让我修改它，改完再继续。

---

操作	关键词	命令
回退	永久 / 丢弃	reset --hard
修改	rebase / 修改	rebase -i

错误修复

关于错误修复，您可以参考如下提示词：

我无法启动前端，不要动代码，请你帮我寻找原因，错误日志：xxx，

我启动了前端，但是单击页面的按钮没有任何反应，不要动代码，请你帮我寻找原因

之后便可尝试让它进行修复，不过仍然建议每完成一个模块的修复步骤都进行提交，当修复完成之后您可以对它说：

现在请你进行git提交

---

教程到此结束，有任何疑问欢迎联系羽梦，羽梦乐意为您提供帮助！

附录：本教程核心步骤和提示词

---

Plan Mode(计划模式)，整理需求部分，提示词如下：

我暂时就这些想法，你帮我整理一下我的需求，如果你有不确定的地方可以问我，我们先沟通项目需求，等我确认以后再做下一步执行

将以上提示词嫁接在您的需求之后，并发送给处于Plan Mode的Claude Code

示例：

[您的大致项目需求]
我暂时就这些想法，你帮我整理一下我的需求，如果你有不确定的地方可以问我，我们先沟通项目需求，等我确认以后再做下一步执行

---

Edit automatically Mode(编辑模式)，在计划整理完毕，准备执行之前，发送如下提示词：

你需要规划开发步骤,不要一口气做太多,让项目稳定安全有效的推进。 
在项目文件夹内创建开发日志文件夹，按照y-m-d-hm的时间格式自动记录完成的开发事项和待办事项。 
再创建一个docs文件夹,放入项目开发相关的开发需求、技术、设计规范, 执行步骤等等具体标准文件。在你的AGENTS.md(首次需要你创建)文件中添加指引各项标准文件路径以及工作说明 ，项目使用git版本管理，每完成一个独立且可运行的逻辑单元，需要进行Git 提交，随后等待我的下一步指令

---

Edit automatically Mode(编辑模式)，在开发完一个功能或小模块并进行git提交后，新建一个Claude Code对话，发送如下提示词：

请你查看项目结构，完整阅读开发规范和当前开发进度，严格按照规范的开发步骤继续完成开发，你可以从AGENTS.md开始看起

---