一分钟看懂
- 在扩展视图(Cmd+Shift+X)里安装 Anthropic 出品的「Claude Code」——扩展 ID 是 anthropic.claude-code。要求 VS Code 1.94.0 以上；Cursor 和 Open VSX 上架的是同一个扩展。
- 面板自带一份 CLI 拷贝：它不会把 claude 加进 PATH。想在 VS Code 集成终端里用真正的 CLI，就把独立安装版也装上——两者共享会话历史。
- 权限模式就在输入框底部：Plan 是只读规划，Manual 是逐次编辑审批，Auto 由安全分类器后台审查。用 Shift+Tab 循环切换。
- @ 提及能把文件拉进上下文（Option+K 插入行范围引用），diff 左右对照、每处改动都有 Accept/Reject 按钮；/usage、/model、/mcp 在面板里直接可用。
Claude Code Full Course — Autonomous Goals, MCP, and VS Code Setup
频道：freeCodeCamp.org1:21:37
VS Code — official documentation
官方来源：code.claude.com/docs
Claude Code for VS Code — marketplace listing
官方来源：marketplace.visualstudio.com
各步骤均对照官方 VS Code 文档核实；上面 freeCodeCamp 的完整课程是截图的画面来源。
截图版权归各自创作者所有，并深链到对应时间点；未使用任何人脸镜头。
在 VS Code 里配置 Claude Code，一步一步来
第 1 部分 — 安装与连接
- 1
从市场安装扩展
打开扩展视图（Mac 按 Cmd+Shift+X，Windows/Linux 按 Ctrl+Shift+X），搜索「Claude Code」，安装 Anthropic 发布的那个(ID:anthropic.claude-code)。需要 VS Code 1.94.0 或更高版本，以及付费 Claude 订阅或 Console 账号。搜不到就运行「Developer: Reload Window」。
- 2
找到火花图标
装好之后，编辑器标签页工具栏（打开文件时）和活动栏会出现 Claude Code 火花图标。点它打开面板——或者按命令面板(Cmd+Shift+P)，输入「Claude Code」，选「Open in New Tab」。状态栏的「✻ Claude Code」入口在没有打开文件时也能用。
Claude Code 火花图标就在编辑器标签页工具栏上——一下点击，面板就在文件旁边打开。跳到 43:00 观看 - 3
登录：订阅、Console 或 API key
在面板里运行 /login，选择你的方式：Claude 订阅(Pro、Max、Team、Enterprise)、Console 账号或 API key。浏览器会打开一次做授权，然后面板就用你的模型和订阅计划跟你打招呼——扩展不需要单独的账号。
- 4
认识面板
Claude Code 会话直接渲染在 VS Code 里——作为面板、在侧边栏或在集成终端，随你选（preferredLocation 设置）。欢迎横幅会显示当前模型、你的计划，以及需要注意的事，比如等着认证的 MCP 服务器。
初次见面：终端面板里的 Claude Code 欢迎横幅，Shift+Tab 上循环的 plan 模式，还有 /mcp 认证提醒。跳到 17:00 观看
第 2 部分 — 在面板里干活
- 5
选择权限模式
模式指示器在输入框底部。Plan 让 Claude 在你批准计划之前保持只读；Manual 在文件编辑和大多数 shell 命令前先询问；Auto 由安全分类器在后台审查操作。Shift+Tab 循环切换，默认值用 initialPermissionMode 设置。
- 6
先规划，提问当场回答
较大的改动从 Plan 模式开始：Claude 先调研，然后给出一份可以像 markdown 文档一样批注的计划。这段录屏里它走得更远——就技术栈抛出一道选择题，并在动笔之前预览它打算创建的文件树。
Plan 模式实战：一道选项可点的交互题，加上 Claude 想创建的文件的预览。跳到 19:00 观看 - 7
把 Claude 指向对的文件
输入 @ 即可模糊提及文件；按 Option+K(Alt+K)插入 @app.ts#5-10 这样的行范围引用。你在编辑器里选中的内容 Claude 自动可见，attachOpenFile 默认会把打开的文件附进提示词。
- 8
审 diff，逐处接受
Manual 模式下每次编辑都会打开左右对照的 diff，每个代码块带「Accept this change」「Reject this change」按钮——留下一块改动、拒绝它的邻居也行。「Claude Code: Accept Change at Cursor」和对应的 Reject 命令都在命令面板里。
- 9
围观思考过程
从 / 命令菜单打开扩展思考，Claude 的推理会以折叠块的形式出现在回答上方。想审查某个决定是怎么做出来的，按 Ctrl+O 全部展开——做代码评审时很好用。
第 3 部分 — 调校
- 10
会话中途切换模型
点击面板里的模型名或运行 /model 来切换——架构设计用 Opus Plan，日常速度用 Sonnet，小修小补用 Haiku。Effort 级别和 Ultracode 开关也在同一个选择器里，和终端的行为一致。
- 11
项目设置放 .claude/settings.json
设置指南讲的一切在这里照旧适用：面板读取 ~/.claude/settings.json 加上项目的 .claude/settings.json，enabledPlugins 这类团队级键就住在后者。VS Code 专属的附加键(initialPermissionMode、preferredLocation、autosave)也共用同一份 schema。
VS Code 里的项目设置：.claude/settings.json 用 enabledPlugins 键给全团队启用一个官方插件。跳到 42:25 观看
扩展面板 vs 集成终端 vs 外部终端
Claude Code 会通过三个 VS Code 界面找到你。它们共享历史和登录——但并不是同一个工具：
- 1图形面板——可点击的 diff、逐处 accept/reject、模型和模式的下拉菜单。适合审改动、保持鼠标流。
- 2集成终端 CLI——完整命令集：! bash 快捷键、Tab 补全、所有斜杠命令和技能。适合打字比点击快的重度用户。
- 3外部终端加 /ide——在 VS Code 外面跑 claude，它会自动连上编辑器提供 diff 和诊断；在不自动连接的终端里，在 Claude Code 中输入 /ide 手动挂载。
- 4扩展自带 CLI，所以装了它 claude 并不会进 PATH——想要终端体验，就再装独立版。
- 5会话历史在三者之间共享：从任何一处 claude --resume 都能接着面板里的对话，/ide 负责把会话上下文连起来。
经验法则：面板审，终端开。大多数人最后会在同一个会话里两个都用——它本来就是为此设计的。
扩展罢工了？急救五招
VS Code 里 Claude Code 扩展的问题，五招基本全覆盖：
- 1搜索结果里找不到扩展。确认 VS Code 版本(1.94.0+)，然后运行「Developer: Reload Window」。Microsoft 市场不可用的构建，可以去 Open VSX 和 Cursor 的扩展源安装。
- 2集成终端里没有 claude。扩展自带 CLI 但不碰 PATH——跑一遍独立安装脚本，或者继续用面板。
- 3「2 MCP servers need authentication」横幅。在面板里运行 /mcp，逐个批准待认证的服务器——项目 .mcp.json 里的服务器要求每个账号显式走一次 OAuth。
- 4diff 不出现。这取决于模式：Plan 模式不产生可 diff 的编辑，bypass 类模式可能跳过审批。要逐处审查就切到 Manual(Shift+Tab)。
- 5卸载后扩展自己装回来。CLI 会在启动时自动安装 IDE 扩展——在 /config 里关掉「Auto-install IDE extension」，或设置环境变量 CLAUDE_CODE_IDE_SKIP_AUTO_INSTALL。
还是不行？终端跑 claude doctor，面板跑 /status——两个一凑，坏掉的那一环在一屏之内就被点名。