01 Vibe Coding 实践指南

学习理念：Vibe Coding 不是"不写代码"，而是"用自然语言和 AI 协作开发"。你的角色从"写代码的"变成"翻译官+质检员"——把业务需求翻译成 AI 能理解的任务，再验证 AI 的输出是否靠谱。这一章讲的就是怎么当好这个翻译官。
海外对标：Andrej Karpathy（Vibe Coding 概念提出者）、OpenAI Codex CLI、Cursor IDE

本节 AI 替代率：~85% | 人工干预率：~15%

角色	能力范围
🤖 AI 擅长	生成代码、拆解需求、写 Prompt 模板、Code Review
👤 人类需理解	好 Prompt 怎么写、工具怎么选、AI 输出怎么验证

📌 来源说明：以下内容提取自 24_尚硅谷大模型技术之vibecoding/1.笔记/尚硅谷vibecoding.md，这是一章纯理论内容，按"理念→工具→Skill→Prompt→面试"串联。

📖 阅读优先级

等级	章节	说明
🔴 值得跑通	Cursor/Codex 配置	装好就是生产力，半小时搞定
🟡 理解即可	Vibe Coding 理念 + Skill	和你之前讨论的观点一致
🟢 了解即可	面试题	需要的直接翻原文

一、什么是 Vibe Coding

🟡【理解即可】 这个理念和我们之前讨论的完全一致——人做决策，AI 写代码。

传统开发流程：

人写需求 → 人设计架构 → 人写代码 → 人调试 → 人部署上线

Vibe Coding 流程：

人描述目标 → AI 拆解任务 → AI 生成代码 → 人审查反馈 → AI 修改 → 人交付

核心不是"AI 替代人"，而是"人和 AI 形成开发搭档"。

1.1 Vibe Coding 需要的能力

能力	说明	对你来说
表达能力	能把需求说清楚	✅ 翻译官的核心技能
拆解能力	能把大目标拆成小任务	✅ 积木拼接的前提
判断能力	能判断 AI 方案是否靠谱	✅ 验证 AI 输出
调试能力	能定位问题并持续修正	✅ 必要时的兜底技能
负责能力	保证项目可运行可维护	✅ 最终对客户负责

1.2 常见误区

误区	正解
"Vibe Coding = 不会代码也能做一切"	AI 降低门槛，但不理解代码会踩坑（跑不起来、安全漏洞）
"Prompt 越长越好"	越清楚越好，不是越长
"AI 生成的代码可以直接信"	必须验证功能、审查代码、检查安全

二、AI 编程工具全景

🔴【值得了解】 目前主流的四个工具，知道各自适合什么场景就够了。

工具	适合场景	特点
Cursor	IDE 内编码、补全、重构	对新手友好，边看代码边对话
Codex	终端开发、代码库修改	工程搭档，可读项目、改文件、跑命令
Claude Code	长上下文项目分析、Agent 工作流	适合复杂项目理解与修改
GitHub Copilot	日常补全、函数生成	融入传统 IDE 工作流

三、Cursor 的配置与使用

🔴【值得跑通】 Cursor 是目前最推荐的 AI IDE，30 分钟装好就能用。

3.1 安装

bash

# 1. 下载
访问 https://cursor.com/cn/ → Download for Windows

# 2. 安装
双击安装，和普通软件一样

# 3. 注册账号
官网注册（需要科学上网）

# 4. 网络配置
修改网络适配模式为 http/1.1（否则可能连不上）

# 5. 购买 CodingPlan
最低 20 美元/月，支持支付宝

3.2 四种对话模式

🔴【必须理解】 选对模式比写好 Prompt 更重要。

模式	适用场景	会改代码吗？
Agent	直接干活——实现功能、修 Bug、补测试	✅ 会
Plan	先商量方案——需求不清、改动较大	❌ 不会
Debug	定位问题——报错、测试失败、页面异常	⚠️ 偏向分析
Ask	只问问题——解释代码、查功能位置	❌ 不会

简单选法：

想让它直接干活 → Agent
想先商量方案 → Plan
有 Bug 要查 → Debug
只想问问题 → Ask

3.3 使用技巧

技巧	说明
选中代码再提问	缩小检索范围，提高准确率，省 Token
贴截图	可以直接 Ctrl+C 截图到对话窗口
长图片引用文件	含大量文字的图片先保存再引用
文件可回滚	Cursor 自带版本管理，可按段落回滚
卡死就重来	出现"卡死提示"别等，重新提交问题

四、Codex 的配置与使用

🔴【值得跑通】 Codex 是 OpenAI 的 CLI 工具，适合终端开发。

4.1 安装

bash

# 前置条件：安装 Git + Node.js

# 一键安装（商家提供方式）
npm install -g pumpkinai-config
codex-config
# 输入商家给你的 API Key 即可

# 手动安装（通用方式）
npm install -g @openai/codex
# 如果网络有问题：
npm install -g @openai/codex --registry https://registry.npmmirror.com

# 验证
codex --version

4.2 配置

配置文件位置：C:\Users\<用户名>\.codex\config.toml

toml

model_provider = "codex"
model = "gpt-5.4"
model_reasoning_effort = "high"

[model_providers.codex]
name = "codex"
base_url = "https://code.ppchat.vip/v1"
wire_api = "responses"
requires_openai_auth = true

认证文件：C:\Users\<用户名>\.codex\auth.json

json

{
    "OPENAI_API_KEY": "sk-xxx"
}

4.3 三种权限模式

权限	说明	风险
默认权限	沙箱工作，敏感操作需手动确认	低
自动审查	系统自动审核高权限操作	中
完全访问	基本取消沙箱限制	高——谨慎使用

4.4 Codex vs Cursor 对比

维度	Cursor	Codex
界面	IDE（图形化）	CLI（命令行）
文件选择	✅ 可选中指定文件	❌ AI 自动扫描整个目录
读写模式	✅ Agent/Plan/Ask 控制	❌ 需在 Prompt 中明确说明
卡死情况	偶尔	几乎不会
最低费用	$20/月	有弹性套餐

五、Skill——把经验沉淀下来

🟡【理解即可】 Skill 就是"给 AI 的操作手册"——和你前面的 skills/ 目录是一个逻辑。

	Prompt	Skill
性质	一次性沟通	可复用的 SOP
场景	临时对话	固定任务（Code Review/PRD生成/测试用例）

适合做成 Skill 的内容：PRD 生成、代码 Review 标准、前端设计规范、API 文档规范、测试用例规范、周报生成规范。

Skill 示例：代码 Review

markdown

# Code Review Skill

## 检查重点
1. 是否有明显 Bug
2. 是否有安全风险
3. 是否破坏原有功能
4. 是否缺少测试
5. 是否有性能问题
6. 是否存在命名混乱或结构不清晰

## 输出格式
先输出高风险问题，再输出中低风险问题。
每个问题必须包含：文件位置、问题说明、影响范围、修改建议。

六、Prompt Engineering for Coding

🟡【理解即可】 好 Prompt = 背景 + 目标 + 约束 + 验证。

6.1 好 Prompt 四要素

要素	说明	例子
背景	在做什么项目、技术栈	"我正在做一个电商客服系统的后端"
目标	希望 AI 完成什么	"请帮我加一个物流查询 Action"
约束	不能做什么、必须遵守	"不要修改 flow_config/ 以外的文件"
验证	完成后如何确认正确	"完成请运行 tests/ 下的单元测试"

6.2 常用模板

需求拆解：

text

我想做一个【产品名称】，目标用户是【用户群体】。
核心目标是【目标】。
请帮我拆解：用户角色、使用场景、MVP 功能、页面清单、数据对象、开发优先级、潜在风险。

技术方案：

text

请基于以下需求设计技术方案：【粘贴需求】
请输出：推荐技术栈、前端结构、后端结构、数据库表设计、API 列表、开发里程碑、风险与替代方案。

Debug：

text

我遇到了以下报错：【粘贴报错】
触发步骤：1.【步骤一】2.【步骤二】
期望结果：【期望】实际结果：【实际】
请帮我分析可能原因，并给出最小修改方案。

七、Vibe Coding 面试题速览

🟢【了解即可】 需要面试时直接翻原文，这里只列问题清单。

你怎么理解 Vibe Coding？
AI 生成代码最大的问题是什么？
Cursor 和 Codex 有什么区别？
你如何写一个好的 Coding Prompt？
讲一个你用 AI 辅助完成项目的经历。
如果 AI 把项目改坏了怎么办？
AI 编程会不会让程序员失业？

八、技术栈健康度

技术	健康度	说明
Cursor	🔥 巅峰	AI IDE 当前最优选择
Codex (OpenAI)	🔥 巅峰	CLI 开发工具标准
Claude Code	🔥 巅峰	长上下文 Agent 工作流
GitHub Copilot	🟢 稳定	补全型工具，功能相对基础
Vibe Coding 理念	🔥 巅峰	AI 辅助开发范式已确认

01 Vibe Coding 实践指南 ​

📖 阅读优先级 ​

一、什么是 Vibe Coding ​

1.1 Vibe Coding 需要的能力 ​

1.2 常见误区 ​

二、AI 编程工具全景 ​

三、Cursor 的配置与使用 ​

3.1 安装 ​

3.2 四种对话模式 ​

3.3 使用技巧 ​

四、Codex 的配置与使用 ​

4.1 安装 ​

4.2 配置 ​

4.3 三种权限模式 ​

4.4 Codex vs Cursor 对比 ​

五、Skill——把经验沉淀下来 ​

Skill 示例：代码 Review ​

六、Prompt Engineering for Coding ​

6.1 好 Prompt 四要素 ​

6.2 常用模板 ​

七、Vibe Coding 面试题速览 ​

八、技术栈健康度 ​

01 Vibe Coding 实践指南

📖 阅读优先级

一、什么是 Vibe Coding

1.1 Vibe Coding 需要的能力

1.2 常见误区

二、AI 编程工具全景

三、Cursor 的配置与使用

3.1 安装

3.2 四种对话模式

3.3 使用技巧

四、Codex 的配置与使用

4.1 安装

4.2 配置

4.3 三种权限模式

4.4 Codex vs Cursor 对比

五、Skill——把经验沉淀下来

Skill 示例：代码 Review

六、Prompt Engineering for Coding

6.1 好 Prompt 四要素

6.2 常用模板

七、Vibe Coding 面试题速览

八、技术栈健康度