Cursor AI 编辑器入门教程：从零构建作品集网站

Cursor 是一款以 AI 为核心的代码编辑器，它把大语言模型直接嵌入编码流程，让开发者用自然语言提示就能编辑文件、生成应用甚至修改整站样式。本文根据 B 站 UP 主的实操演示，梳理 Cursor 的核心功能、模式选择与实际构建流程，帮助新手快速上手。

Cursor 是什么：VS Code 的 AI 进化版

Cursor 本质上是一个类 Visual Studio Code 的代码编辑器，界面布局和操作逻辑与 VS Code 高度一致，因此有开发经验的用户几乎零学习成本即可迁移。它甚至支持直接从 VS Code 导入设置和快捷键。

真正的差异在于内置的 AI 代理（Agent）。这个代理能理解整个代码库的上下文，帮你规划、搜索并构建所需的一切，还能访问顶级模型进行精准的代码重写。除此之外，Cursor 提供标签页补全、多行编辑、代码智能重写等能力，把 AI 辅助编程整合到了一个工作区里。

在价格方面，Cursor 提供带有部分限制的免费版本，付费档位分为 20 美元、60 美元和 200 美元，档位越高，AI 使用量、新功能优先访问权以及无限代码补全等权益越充分。此外还有面向团队、企业和商业用户的方案。

AI 代理（Agent） 是一种能够自主规划并执行多步骤任务的 AI 系统，与普通聊天机器人的"一问一答"不同，它可以在没有逐步人工指令的情况下分解目标、调用工具（如读写文件、执行命令）并持续迭代直到完成任务。Cursor 内置的 Agent 能扫描整个代码库来理解项目结构和依赖关系，这种"代码库级别的上下文感知"使它可以跨文件进行一致性修改，而不仅仅是补全单行代码。这也是 Cursor 与简单 AI 补全插件（如早期 GitHub Copilot）的核心区别所在。

四种交互模式：让 AI 各司其职

下载安装 Cursor（官网右上角下载按钮，支持 Windows、macOS 等多平台）并完成设置后，即可进入主界面。这里可以打开本地项目、从 GitHub 克隆仓库、通过 SSH 连接，或直接与 AI 聊天。

界面右侧的智能体聊天（Agent Chat）是与 AI 交互的核心区域，目前提供四种主要模式：

• 智能体模式（Agent）：为你规划、搜索并直接构建所需内容，一步到位地编写代码。
• 规划模式（Plan）：先列出将要执行的步骤计划，供你审阅后再执行。
• 调试模式（Debug）：修复代码中发现的错误或警告。
• 提问模式（Ask）：像使用普通聊天机器人一样，就代码或实现方式提问。

模型可以手动搜索选择，也可以让 Cursor 自动选择。在提示中，你能用 @ 引用具体文件、分支、GitHub 内容或之前的聊天记录，还能连接浏览器获取搜索上下文（具备 RAG 检索能力），并支持上传图片、录制语音、上传文件等多模态输入。

RAG（检索增强生成，Retrieval-Augmented Generation） 是一种让大语言模型在生成回答时，先从外部知识源检索相关内容、再将其作为上下文输入模型的技术。Cursor 支持连接浏览器进行 RAG 检索，意味着你可以让 AI 在回答问题或生成代码时，实时抓取最新文档、Stack Overflow 答案或 GitHub Issues 作为参考依据，从而弥补模型训练数据存在截止日期的局限，尤其适合需要使用最新版 API 或框架的项目。

实战演示：五分钟生成作品集网站

UP 主的演示目标是构建一个包含设计与文案规格的作品集网站。他强调了一个关键经验：提示越详细，效果越好——在文案、设计、功能等各个细节上都描述清楚，AI 产出的质量会明显提升。

在智能体模式下，Cursor 会先规划步骤、列出细节，用户点击执行后便开始实时构建文件和代码。整个过程可视，用户能看到每一步生成的 HTML 等文件。演示中，Cursor 大约用了五分钟就生成了一个包含 Hero 区块、精选项目、关于我、技能列表、联系方式等完整板块的现代作品集网站，且已达到可上线状态。

值得肯定的一点是控制权设计：每一步更改，用户都可以选择「保存全部」保留，或「撤销全部」回退到之前状态，避免了 AI 一次性覆盖导致不可控的问题。UP 主还提到，可以直接问 AI「如何运行它」，它会给出多种运行方式供选择。

迭代修改：用规划模式做二次调整

网站生成后，修改同样只需回到编辑器输入提示。演示中，UP 主要求 AI 完成两处改动：添加一个包含数据的专业工作经历板块，并把配色方案改成更绿、更暗的现代风格。

这次他选择了规划模式。Cursor 先生成一个文本文件，列出将要执行的所有步骤，供用户审阅和编辑。确认满意后，聊天区和代码区都会出现「构建」按钮，同时展示 AI 自己的待办事项清单。点击构建后，更改会实时部署。

最终结果完全符合计划：网站换上了绿黑风格的视觉，并新增了工作经验栏目。用户可以在代码库中清晰看到 AI 删除和新增的所有内容。

完成后，网站可以像普通代码项目一样部署到自有域名或第三方平台。如果需要加入自己的图片，也可以按处理代码文件夹的方式添加。

扩展与总结：更少麻烦，更快构建

Cursor 保留了 VS Code 的扩展生态，打开侧边栏即可搜索并安装任意数量的扩展，编码方式不受限制。对熟悉 VS Code 或其他编辑器的开发者来说，几乎所有既有功能都能无缝沿用。

Cursor 的核心价值在于把 AI 代理、编码指南和编辑环境集中在一处：让 AI 承担大量重复的编码与修改工作，从而实现「麻烦更少、功能更强、构建更快、执行更快」的开发体验。对于想快速将创意变成可运行项目、或用 Vibe Coding 方式赋能业务的用户，Cursor 提供了相当低的门槛和很高的自由度。

提示：本文基于 B 站 UP 主的演示教程整理，实际功能与定价请以 Cursor 官方为准。

Vibe Coding 是由 OpenAI 联合创始人 Andrej Karpathy 于 2025 年初提出的编程方式，核心理念是"完全沉浸在氛围中，忘掉代码本身的存在"——开发者只需用自然语言描述意图，由 AI 全程生成并迭代代码，人类的角色从"逐行编写"转变为"审阅、测试与方向引导"。这种模式大幅降低了非专业开发者将想法付诸实现的门槛，但也对提示质量和对 AI 产出的审查能力提出了更高要求，以避免积累难以察觉的潜在错误。Cursor 因其完整的 Agent 工作流和逐步撤销机制，被认为是 Vibe Coding 的主流工具之一。