Claude Code 通关手册（一）：Cursor 用户转 Claude Code，第一天我就后悔了——后悔没早点用

前端达人

发布于 2026-03-12 12:57:52

300

文章被收录于专栏：前端达人前端达人

这是「Claude Code 通关手册」系列的第 1 篇，共 10 篇。本系列将带你从零开始，系统掌握 Claude Code 的完整知识体系——从 CLI 命令到自动化工作流，从个人使用到团队协作。

你可能已经在用 Cursor 写代码了。

每天打开编辑器，Tab 一下自动补全，Cmd+K 唤出 AI 对话框，写写改改，效率还不错。

然后某天你听说了 Claude Code，装上一看——一个光秃秃的终端界面，没有花哨的 UI，没有智能补全的小弹窗，甚至没有一个像样的"开始"按钮。

你的第一反应大概率是：就这？

别急着关掉它。这个看起来"简陋"的终端工具，藏着一套完全不同的 AI 编程哲学。

今天这篇文章，我不会铺天盖地地讲功能列表，而是带你搞清楚三件事：Claude Code 到底是什么定位、怎么 5 分钟装好跑起来、以及它凭什么让越来越多的开发者"回不去了"。

先搞清一件事：Claude Code 不是"另一个 Cursor"

很多人踩的第一个坑，就是拿 Cursor 的思维去理解 Claude Code。

打个比方你就明白了——

你去餐厅吃饭。Copilot 是那个帮你递菜单、推荐菜品的服务员，你点什么它建议什么，效率确实高。Cursor 是一个坐在你旁边的美食顾问，你边吃边聊，它能帮你分析菜品搭配、调整口味，甚至帮你跟厨房沟通。

那 Claude Code 呢？它是后厨的总调度。

它不坐在你面前陪你聊天，而是直接进厨房——调配原料、指挥厨师、控制出菜节奏、管理整条流水线。你说"我要一桌川菜宴席"，它就去把整桌菜给你安排出来。

翻译成技术语言：

┌──────────────────────────────────────────────────────┐
│               AI 编程工具的三个层次                      │
├──────────────────────────────────────────────────────┤
│                                                      │
│  ┌────────────────┐                                  │
│  │   Copilot       │  代码补全层                      │
│  │   "服务员"      │  → 你写一行，它补下一行           │
│  └───────┬────────┘                                  │
│          ↓                                           │
│  ┌────────────────┐                                  │
│  │   Cursor        │  IDE 集成层                      │
│  │   "美食顾问"    │  → 你改一个文件，它帮你优化       │
│  └───────┬────────┘                                  │
│          ↓                                           │
│  ┌────────────────┐                                  │
│  │  Claude Code    │  平台层                          │
│  │   "后厨总调度"  │  → 你描述需求，它跑完整个流程     │
│  └────────────────┘                                  │
│                                                      │
│  关键区别：                                            │
│  Copilot 帮你写一行代码                                │
│  Cursor 帮你改一个文件                                 │
│  Claude Code 帮你跑完一个流程                          │
│                                                      │
└──────────────────────────────────────────────────────┘

这不是谁好谁差的问题——而是它们根本就不在同一个维度上竞争。

Cursor 的核心价值是"编辑器里的 AI 助手"，Claude Code 的核心价值是"可编程的 AI 开发平台"。

为什么终端界面反而是优势？因为终端意味着：

可脚本化——你能用 bash 脚本调用它，定时执行任务
可编程——官方提供 TypeScript 和 Python SDK，你能像调用函数一样调用它
可集成——塞进 GitHub Actions、CI/CD 流水线，7×24 小时自动运转
可扩展——子代理、MCP 协议、Hooks、Plugins，一整套扩展生态

一句话总结：Cursor 是你的 AI 副驾驶，Claude Code 是你的 AI 自动驾驶系统。 副驾驶再好，也得你握方向盘。自动驾驶系统——你可以告诉它目的地，然后去喝杯咖啡。

当然，自动驾驶也需要学习如何设定目的地和安全规则。这就是本系列要教你的事情。

系列路线图：10 篇带你从入门到自动化

在正式动手之前，先给你看一下全局地图，这样你心里有数——我们要走多远，现在在哪里。

┌─────────────────────────────────────────────────────┐
│            Claude Code 通关手册 · 10 篇路线图          │
├─────────────────────────────────────────────────────┤
│                                                     │
│  ★ 入门篇（你在这里）                                 │
│  ┌─────────────────────────────────────────┐        │
│  │ ① 安装 & CLI 核心命令     ← 本篇 ★       │        │
│  │ ② 权限系统 & @mentions 工作流            │        │
│  └─────────────────────────────────────────┘        │
│                    ↓                                 │
│  配置篇                                              │
│  ┌─────────────────────────────────────────┐        │
│  │ ③ CLAUDE.md — 给 AI 一份项目说明书       │        │
│  │ ④ 自定义命令 & 模型选择策略               │        │
│  └─────────────────────────────────────────┘        │
│                    ↓                                 │
│  扩展篇                                              │
│  ┌─────────────────────────────────────────┐        │
│  │ ⑤ 子代理 — 从单兵作战到 AI 团队          │        │
│  │ ⑥ MCP 协议 — 连接整个开发生态            │        │
│  │ ⑦ Hooks + Skills + Plugins              │        │
│  └─────────────────────────────────────────┘        │
│                    ↓                                 │
│  自动化篇                                            │
│  ┌─────────────────────────────────────────┐        │
│  │ ⑧ Headless + SDK — 用代码指挥 AI         │        │
│  │ ⑨ GitHub Actions + 沙箱安全              │        │
│  └─────────────────────────────────────────┘        │
│                    ↓                                 │
│  协作篇                                              │
│  ┌─────────────────────────────────────────┐        │
│  │ ⑩ 从个人利器到团队基建                    │        │
│  └─────────────────────────────────────────┘        │
│                                                     │
└─────────────────────────────────────────────────────┘

每一篇都会围绕一个真实的 Next.js 技术博客项目（DevPulse） 来做实操演示。不是干巴巴讲概念，而是每篇都有你能跟着做出来的东西。

好了，地图看完了，现在开始第一步——把 Claude Code 装上。

安装 Claude Code：三条路线，选适合你的

2026 年 2 月的重要更新：Anthropic 官方已经将 npm 安装标记为废弃（deprecated），推荐使用原生安装器。原生安装器不依赖 Node.js，启动更快，自动更新。

路线一：原生安装器（官方推荐）

这是目前最推荐的方式，一行命令搞定，不需要预装 Node.js。

macOS / Linux：

curl -fsSL https://claude.ai/install.sh | bash

安装完成后，重新加载你的 shell 配置：

# 如果你用 zsh（macOS 默认）
source ~/.zshrc

# 如果你用 bash
source ~/.bashrc

Windows（PowerShell）：

irm https://claude.ai/install.ps1 | iex

Windows 用户注意：如果你习惯用 WSL（Windows Subsystem for Linux），也可以在 WSL 的 Ubuntu 终端里用 Linux 的安装命令。两种方式都可以，选你顺手的。

验证安装：

claude --version

看到版本号输出，就说明安装成功了。如果遇到问题，Claude Code 内置了一个"医生"命令，帮你自动诊断：

claude doctor

它会检查你的安装状态、PATH 配置、认证状态等，哪里有问题一目了然。

路线二：Homebrew（macOS 用户的备选）

brew install claude-code

注意：Homebrew 安装不会自动更新，需要你手动执行 brew upgrade claude-code 来获取新版本。考虑到 Claude Code 更新非常频繁（几乎每周都有新功能），我个人更推荐路线一。

路线三：npm（仍然可用，但已废弃）

npm install -g @anthropic-ai/claude-code

如果你之前通过 npm 安装过，建议迁移到原生安装器。你的配置文件（~/.claude/settings.json 和项目里的 .claude/ 目录）在迁移过程中会被保留，不用担心丢失。

认证：两种付费方式

Claude Code 不是免费的，你需要选择一种付费方式：

┌──────────────────────────────────────────────────────┐
│              Claude Code 认证方式对比                    │
├──────────────────────────────────────────────────────┤
│                                                      │
│  方式一：Claude Pro / Max 订阅                         │
│  ├── 固定月费，适合高频使用者                           │
│  ├── 首次启动时浏览器弹窗登录                          │
│  └── 推荐给日常开发使用的同学                          │
│                                                      │
│  方式二：API Key（按量付费）                            │
│  ├── 用多少付多少，适合偶尔使用或自动化场景              │
│  ├── 在 Anthropic Console 获取 Key                    │
│  └── 设置环境变量：                                    │
│      export ANTHROPIC_API_KEY="your-key-here"         │
│      （加到 ~/.zshrc 或 ~/.bashrc 中持久生效）          │
│                                                      │
│  选择建议：                                            │
│  如果你每天都用 → 订阅更划算                            │
│  如果你主要跑自动化脚本 → API Key 更灵活                │
│                                                      │
└──────────────────────────────────────────────────────┘

第一次启动 claude 命令时，它会引导你完成认证流程，跟着提示走就行。

四个命令打天下：90% 的日常工作就靠它们

Claude Code 的命令其实非常多，但你刚开始只需要记住四个。就像学开车——你不需要一上来就研究发动机原理，先学会启动、刹车、转向、倒车，就能上路了。

命令一：`claude` —— 启动交互模式

# 进入你的项目目录
cd your-project

# 启动 Claude Code
claude

这是你最常用的命令，没有之一。输入 claude 后回车，你就进入了一个交互式对话界面。在这里，你可以用自然语言跟 Claude 交流，让它帮你分析代码、写功能、修 Bug、做重构。

打个比方：这就是你跟 AI 的"面对面会议室"。你说需求，它干活。

重要细节：一定要先 cd 到你的项目目录再启动。Claude Code 会自动读取当前目录下的文件，作为它理解你项目的上下文。如果你在 HOME 目录启动，它就什么项目信息都看不到。

命令二：`claude -p "提示词"` —— 单次执行

# 问一个问题，得到回答后自动退出
claude -p "这个项目的目录结构是怎样的？给我一个概览"

-p 是 --print 的缩写。它执行一次提示，输出结果，然后自动退出。不会进入交互模式。

什么时候用它？

写 shell 脚本串联自动化任务时
快速问一个不需要多轮对话的问题时
需要把 Claude 的输出 pipe 给其他命令时

# 高级用法：输出 JSON 格式，方便程序解析
claude -p "列出 src/ 下所有组件文件" --output-format json

打个比方：如果 claude 是开一场会，那 claude -p 就是发一条微信消息——问完就走，不用寒暄。

命令三：`claude -c` —— 继续上次对话

# 继续你最近的那次对话
claude -c

你昨天跟 Claude 讨论了一个复杂的重构方案，今天想接着聊。不用重新解释背景，-c（--continue）帮你无缝衔接。

这个命令非常重要，因为 AI 对话中最浪费 Token 的事情就是反复解释上下文。一个 -c 省下的不只是时间，还有真金白银的 Token 费用。

命令四：`claude -r` —— 从检查点恢复

# 回到上一个安全点
claude -r

Claude Code 有一个叫"检查点（Checkpoint）"的机制——每次它做修改之前，会自动保存当前状态。如果它改出了问题，-r（--resume）让你一秒回到之前的安全点。

打个比方：这就是游戏里的"存档读档"。Claude 帮你自动存档，你随时可以读档重来。

四个命令速查表

┌──────────────────────────────────────────────────────────┐
│           Claude Code 四大核心命令                          │
├──────────┬───────────────────┬───────────────────────────┤
│ 命令      │ 用途              │ 比喻                       │
├──────────┼───────────────────┼───────────────────────────┤
│ claude   │ 启动交互模式       │ 开一场面对面会议            │
│ claude -p│ 单次执行           │ 发一条微信消息              │
│ claude -c│ 继续上次对话       │ 昨天的会议今天接着开         │
│ claude -r│ 从检查点恢复       │ 游戏读档                   │
└──────────┴───────────────────┴───────────────────────────┘

先把这四个命令练到条件反射，其他的后面用到了再学。

实战演练：用 Claude Code 初始化 DevPulse 项目

概念讲完了，动手做一次你就全明白了。

我们来创建一个 Next.js 技术博客项目——DevPulse。这个项目会贯穿整个系列，每篇文章都会在它基础上添加新功能。

第一步：创建项目目录并启动 Claude Code

mkdir devpulse && cd devpulse
claude

第二步：用自然语言描述你的需求

进入交互模式后，输入以下内容：

帮我初始化一个 Next.js 14 项目，要求如下：
1. 使用 App Router（不用 Pages Router）
2. TypeScript 严格模式
3. Tailwind CSS 做样式
4. 项目名叫 DevPulse，是一个技术博客平台
5. 创建基础的首页布局，包含导航栏、文章列表区域、侧边栏
6. 组件放在 src/components/ 目录下
7. 页面放在 src/app/ 目录下

然后你会看到 Claude Code 开始工作：

它先分析你的需求，拟定执行计划
然后开始执行命令——npx create-next-app@latest
接着创建组件文件、编写页面代码
最后给你一个总结，告诉你它都做了什么

这个过程中，它会询问你的许可。 比如"我要运行 npx create-next-app，可以吗？"——这就是权限系统在工作。现在你先点"允许"就好，下一篇文章我们会详细讲权限系统的精髓。

第三步：验证项目

Claude Code 完成后，打开一个新终端窗口：

cd devpulse
npm run dev

打开浏览器访问 http://localhost:3000，你应该能看到 DevPulse 的初始页面了。

第四步：用 Claude Code 做一次代码审查

回到 Claude Code 的交互模式（如果已退出，用 claude -c 继续），输入：

审查一下刚才生成的首页组件 @src/app/page.tsx，
看看有没有 TypeScript 类型问题、性能隐患、或者不符合 Next.js 14 最佳实践的地方

注意这里的 @src/app/page.tsx——这是 Claude Code 的文件引用语法。用 @ 符号加文件路径，Claude 会自动读取这个文件的完整内容作为上下文。不用你手动复制粘贴代码。

你还可以引用整个目录：

审查 @src/components/ 目录下所有组件的代码质量

甚至同时引用多个文件：

对比 @src/app/page.tsx 和 @src/app/layout.tsx，
检查它们之间的数据传递是否合理

这个 @ 引用的威力，等你用上就知道了——它比复制粘贴代码高效 10 倍，而且 Claude 能看到完整的文件上下文而不是你截取的片段，给出的建议自然也更准确。

Claude Code 凭什么让人"回不去"？

说到这里，你可能已经感觉到了——Claude Code 跟其他 AI 编程工具的交互方式完全不同。

但"不同"不代表"更好"，对吧？我来说说它真正让人"回不去"的三个特质：

特质一：它直接操作你的项目，而不是给你看代码片段

在 Cursor 里，AI 建议你怎么改，你接受后它帮你改。这已经很好了。

但 Claude Code 更进一步——你告诉它"给这个项目加上暗色模式"，它会自动找到需要修改的文件、创建新的组件、修改配置、甚至跑一下看看有没有报错。

它不是给你一段代码让你自己贴，而是直接帮你把活干了。 当然，每一步它都会征求你的同意（权限系统），你保留完全的控制权。

特质二：它能"记住"你的项目

通过后面要讲的 CLAUDE.md 文件（第 3 篇），你可以把项目的架构、编码规范、技术栈信息写进去。Claude Code 每次启动都会自动读取这个文件。

结果就是：你不需要每次都解释"我们用 TypeScript 严格模式""组件要用函数式声明""提交信息要用英文"这些废话。它打开项目就知道该怎么干活。

这跟你带一个新同事是完全不同的体验——你只需要写一次"新人入职手册"，以后它每天上班都带着这份手册来。

特质三：可编程，可自动化

这是 Claude Code 最深层的杀手锏，也是它与所有 IDE 内置 AI 的根本区别。

后面的文章会详细展开，这里先给你一个画面：

┌──────────────────────────────────────────────────────┐
│           Claude Code 能做但 Cursor 做不到的事          │
├──────────────────────────────────────────────────────┤
│                                                      │
│  场景一：每天凌晨自动扫描代码仓库，生成质量报告          │
│  场景二：每个 PR 提交后自动做 AI 代码审查                │
│  场景三：用 TypeScript SDK 构建自定义开发工具            │
│  场景四：多个 AI 子代理并行工作，各司其职                │
│  场景五：连接 GitHub、数据库、文档系统，跨平台协作        │
│                                                      │
│  关键词：脚本化、SDK、子代理、MCP、Hooks、Plugins        │
│  → 这些都是本系列后续文章的重点内容                      │
│                                                      │
└──────────────────────────────────────────────────────┘

这些不是概念演示，而是你跟着本系列做完就能实际用上的东西。

几个新手常踩的坑，提前帮你避开

坑 1：在 HOME 目录启动 Claude Code

Claude Code 会扫描当前目录来理解你的项目。如果你在 ~ 目录启动，它要么读不到项目信息，要么试图扫描你整个硬盘。永远先 cd 到项目目录再启动。

坑 2：看到权限询问就烦了，直接关掉

开始阶段，Claude Code 每做一步都会问"可以吗？"——读文件问一次，写文件问一次，跑命令问一次。这确实有点烦。但别因此放弃，下一篇文章我会教你怎么配置权限，让它该问的问、不该问的自动通过。这是从"能用"到"好用"的关键跨越。

坑 3：把 Claude Code 当聊天机器人

有人启动 Claude Code 后开始问它"今天天气怎么样""给我讲个笑话"——拜托，这是一个开发工具，不是闲聊助手。它的设计就是围绕代码和开发任务的。你越具体、越技术化地描述需求，它的表现越好。

好的提示词：

分析 @src/app/api/posts/route.ts 这个 API 路由，检查错误处理是否完善，有没有遗漏的边界情况

不好的提示词：

帮我看看代码有没有问题

坑 4：不知道 claude doctor 这个命令

遇到任何安装或运行问题，先跑一次 claude doctor。它会自动诊断大多数常见问题，比手动排查快得多。

本篇小结

三个核心收获：

第一，Claude Code 不是"终端版 Cursor"。它是一个可编程的 AI 开发平台，终端界面是它的优势而不是劣势——因为终端意味着可脚本化、可编程、可集成到自动化流水线中。

第二，四个命令就能开始干活：claude 进入交互模式、claude -p 单次执行、claude -c 继续对话、claude -r 检查点恢复。先练熟这四个，其他用到了再学。

第三，@ 文件引用是你最强的提效武器。用 @文件路径 给 Claude 提供精确的上下文，比复制粘贴代码好用十倍。

通关检查清单

[ ] Claude Code 安装成功，claude --version 有输出
[ ] 认证完成，能正常启动交互模式
[ ] 用 Claude Code 创建了 DevPulse 项目（或你自己的项目）
[ ] 试过 @ 文件引用做代码审查
[ ] 试过 claude -c 继续上次对话
[ ] 知道 claude doctor 这个排障命令

全部打勾？恭喜通关第一关。

下篇预告

第 2 篇：Claude Code 通关手册（二）—— 权限系统搞明白，效率直接翻倍

下一篇我们要解决 Claude Code 最让新手抓狂的问题——"每一步都要问我同意不同意，烦死了！"

其实权限系统不是锁链，而是油门和刹车。学会调节，Claude Code 的速度感完全不一样。我会教你怎么配置"读操作自动通过、写操作手动确认"的黄金组合，让权限提示减少 80% 的同时保留完全的安全控制。

今日话题

你目前在用哪些 AI 编程工具？Cursor、Copilot、通义灵码、还是其他的？用下来感觉如何？评论区聊聊，看看大家的选择和体验。

如果这篇文章对你有帮助，欢迎点赞、在看、转发三连，让更多前端开发者看到这个系列。

关注「前端达人」，我们下篇见。

本文参与腾讯云自媒体同步曝光计划，分享自微信公众号。

原始发表：2026-02-22，如有侵权请联系 cloudcommunity@tencent.com 删除

cursor

本文分享自前端达人微信公众号，前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

登录后参与评论

0 条评论

热度