Claude Code VS Code 插件使用教程

更新于 2026-10-21 · 阅读约 16 分钟

Claude Code VSCode 插件（扩展市场里的名字是 Claude Code for VS Code，发布者 Anthropic）把 Claude Code 搬进了编辑器：在侧边栏里对话，Claude 的改动以并排 diff 的形式显示，选中的代码会自动作为上下文。这篇教程讲怎么安装插件、怎么接入 cdnd（Claude Code 中转站） 跳过登录、日常怎么用，以及插件和终端命令行版的区别。

安装 Claude Code VS Code 插件

插件要求 VS Code 1.94.0 或更高版本（在 Help > About 里查看）。

1. 按 Cmd+Shift+X（Windows、Linux：Ctrl+Shift+X）打开扩展视图。
2. 搜索 "Claude Code"，认准发布者是 Anthropic、扩展 ID 是 anthropic.claude-code。
3. 点击 Install。

装好后如果侧边栏没有出现插件，重启 VS Code，或者在命令面板里运行 Developer: Reload Window。

Cursor 和其他 VS Code 分支

• Cursor：同样在扩展视图里搜索 "Claude Code" 安装。
• 其他 VS Code 分支（官方文档举例 Devin Desktop、Kiro）：在编辑器的扩展视图里搜索，或者从 Open VSX 安装。
• 装不了扩展的编辑器：安装命令行版 Claude Code，在编辑器自带的终端里运行 claude。

插件和命令行版要分别安装吗

插件自带一份 Claude Code，用来驱动聊天面板，所以只用插件不需要另外安装。但插件不会把 claude 命令加进系统 PATH：想在 VS Code 的终端里运行 claude，或者使用 claude mcp add、claude --resume 这些命令，还要按 Claude Code 安装教程 单独装一次命令行版。

接入 cdnd：配置 claudeCode.environmentVariables

插件默认第一次打开时要求登录 Claude 账号。用 cdnd 的话不需要登录，把地址和 Key 写进 VS Code 的用户设置即可，这也是 VS Code 插件接入第三方 API 的标准做法：

1. 在 cdnd 控制台 注册并创建一个 API Key，以 sk-cdnd- 开头。
2. 按 Cmd+Shift+P（Windows、Linux：Ctrl+Shift+P），运行 Preferences: Open User Settings (JSON)。
3. 加入下面这一项（文件里已有别的设置时，把这一项合并进最外层的 {}）：

{
  "claudeCode.environmentVariables": [
    { "name": "ANTHROPIC_BASE_URL", "value": "https://api.cdnd.sh" },
    { "name": "ANTHROPIC_AUTH_TOKEN", "value": "sk-cdnd-你的Key" }
  ]
}

4. 保存，运行 Developer: Reload Window，再打开 Claude Code 面板，就会直接进入对话，不再出现登录界面。

地址末尾不要加 /v1。为什么一定要写在 claudeCode.environmentVariables 里、只写 ~/.claude/settings.json 为什么还会弹登录，见 VS Code 插件接入第三方 API。终端里的命令行版怎么配置，见 Claude Code 第三方 API 配置教程。

第一次使用

打开 Claude Code 面板

插件在 VS Code 里用一个火花（Spark）图标表示。打开面板有几种方式：

• 编辑器右上角：点击编辑器工具栏里的火花图标。这个图标只在打开了文件时出现。
• 左侧活动栏：点击火花图标，打开会话列表，选一个会话或新建会话。
• 右下角状态栏：点击 ✻ Claude Code，没有打开文件也能用。
• 命令面板：输入 "Claude Code"，选择 Open in New Tab 等选项。

面板可以拖到任何位置：右侧的辅助侧边栏适合一边写代码一边对话，编辑器区域适合开一个标签页做旁支任务。

发出第一条提示

用中文直接描述你要做什么即可。先选中一段代码再提问，Claude 会自动看到选中的内容：

解释一下这几行在做什么，有没有边界情况没处理

想把文件和行号明确写进提示里，在编辑器里按 Option+K（Windows、Linux：Alt+K），会插入类似 @app.ts#5-10 的引用。

审阅改动

输入框下方显示当前的权限模式。在 Manual 模式下，Claude 每次要改文件，都会打开原文件和修改后内容的并排对比，然后询问是否允许：你可以接受、拒绝，或者告诉 Claude 应该怎么改。也可以先在 diff 里直接改它提议的内容再接受，Claude 会知道你动过。

改动较多时，每一处修改下面都有 Accept this change 和 Reject this change 按钮，可以逐处审阅（需要 v2.1.275 或更高版本，超过 100 处修改的 diff 只能整份审阅）。

核心功能

权限模式和计划审阅

点击输入框底部的模式指示器切换权限模式：

计划模式在插件里体验最好：Claude 写完计划后，VS Code 会把计划作为完整的 Markdown 文档打开，你可以直接在文档里加行内批注，Claude 按批注调整后再开始改代码。也可以在输入框里输入 /plan 进入计划模式，例如 /plan 修复登录失败的 bug。

用 @ 提及文件和文件夹

输入 @ 加文件名或文件夹名，Claude 会读取对应内容。支持模糊匹配，文件夹名后面加斜杠：

@auth 里的登录逻辑是怎么走的？

@src/components/ 下面哪些组件没有写测试？

用 @terminal:名称 可以引用某个终端（名称是终端标题）的输出，报错信息不用再复制粘贴。图片可以直接粘贴进输入框；按住 Shift 把文件拖进输入框可以附加文件。

切换模型和斜杠命令

点击输入框底部的模型名，或者输入 /model，可以在对话中途切换模型。输入 / 会打开命令菜单，可以附加文件、切换模型、开关扩展思考，还能管理 MCP 服务器、hooks、记忆、权限和插件。各个模型怎么选，见 Claude 模型总览。

会话历史和回退

• 恢复对话：点击面板顶部的 Session history 按钮，按关键词搜索或按时间浏览以前的对话。
• 回退：鼠标移到任意一条消息上，点击回退按钮，可以选择从这里分出新对话、把代码退回到这里，或者两者同时做。
• 多个对话并行：在命令面板里用 Open in New Tab 或 Open in New Window 再开一个对话，每个对话的历史和上下文互相独立。

插件、Skills 和 MCP

• 插件：在输入框里输入 /plugins，打开 Manage plugins，在 Plugins 标签页搜索、安装、开关插件，在 Marketplaces 标签页添加插件市场。插件和市场与命令行版共用同一份配置。
• Skills：输入 /skills 查看可用的 Skill。自己写 Skill 的方法见 Claude Code Skills 教程。
• MCP：输入 /mcp 添加、删除、启用或重连 MCP 服务器。

查看花费

用 cdnd 的 Key 时，输入 /usage 显示的是本次会话的花费和 token 用量，不是订阅额度条。cdnd 按 Anthropic 官方美元标价计费，充值 ¥2 = $1，没有月费，详见 Claude Code 价格。

Claude Code VSCode 插件快捷键

有些快捷键取决于焦点在哪里：光标在代码文件里时是编辑器有焦点，光标在 Claude 输入框里时是 Claude 有焦点。

在命令面板里输入 "Claude Code" 可以看到插件的全部命令。终端里的快捷键和斜杠命令见 Claude Code 使用教程。

插件和终端命令行版的区别

需要命令行版独有的功能时，按 Ctrl+`（macOS：Cmd+`）打开 VS Code 的集成终端，运行 claude。命令行版会自动和 VS Code 集成，改动同样在 VS Code 的 diff 视图里显示；在外部终端里运行时，输入 /ide 连接 VS Code。

两边共用同一份对话历史：插件里的对话，在终端里运行 claude --resume 就能找到并继续。

更习惯终端界面的话，也可以让插件直接以终端模式打开：在设置里搜索 Extensions > Claude Code，勾选 Use Terminal。

常见问题排查

配置了还是弹登录

• 变量写在了 ~/.claude/settings.json 而不是 VS Code 用户设置的 claudeCode.environmentVariables 里。插件的登录检查只认后者。
• 改完设置没有重新加载窗口。运行 Developer: Reload Window。
• 想用终端里 export 的变量：从程序坞或开始菜单打开的 VS Code 读不到这些变量，要在终端里运行 code . 打开 VS Code。

看不到火花图标

1. 先打开一个文件，只打开文件夹时编辑器工具栏不显示图标。
2. 确认 VS Code 是 1.94.0 或更高版本。
3. 运行 Developer: Reload Window。
4. 暂时停用其他 AI 插件（如 Cline、Continue）排查冲突。
5. 检查工作区信任：插件在受限模式（Restricted Mode）下不工作。

也可以直接点右下角状态栏的 ✻ Claude Code。

集成终端里找不到 claude 命令

插件不会把 claude 加进 PATH，需要单独安装命令行版，见 Claude Code 安装教程。Windows 上在 PowerShell 终端里看到 Could not locate the Claude CLI on PATH，说明 Claude Code 的安装目录不在系统 PATH 里：把它加到用户或系统环境变量（不要只写在 PowerShell 配置文件里），然后重启 VS Code。

macOS 上 Cmd+Esc 没反应

macOS Tahoe 及更高版本默认把 Cmd+Esc 分配给系统的游戏叠加层（Game Overlay）。在 系统设置 > 键盘 > 键盘快捷键 > 游戏控制器 里取消勾选 Game Overlay，或者在 VS Code 的键盘快捷方式里给 Claude Code: Focus input 换一个按键。

插件装不上

确认 VS Code 版本不低于 1.94.0、VS Code 有安装扩展的权限，或者直接从 VS Code 扩展市场页面 安装。

Remote Control 和语音输入用不了

这两个功能依赖 claude.ai 账号登录，通过 cdnd 这类网关使用时不可用，和插件本身无关。

常见问题

Claude Code 有 VS Code 插件吗？

有。Anthropic 官方发布了 Claude Code for VS Code 插件，扩展 ID 是 anthropic.claude-code，在 VS Code 扩展视图里搜索 "Claude Code" 就能安装，要求 VS Code 1.94.0 或更高版本。Cursor 和其他 VS Code 分支也能安装。

Claude Code VS Code 插件需要登录 Claude 账号吗？

官方默认需要登录。用 cdnd 时不需要：在 VS Code 用户设置的 claudeCode.environmentVariables 里填好 ANTHROPIC_BASE_URL 和 ANTHROPIC_AUTH_TOKEN，重新加载窗口后直接进入对话，也不需要海外信用卡。

VS Code 插件和命令行版能同时用吗？

能。两者共用同一份对话历史和 ~/.claude/settings.json 设置，插件里的对话可以在终端用 claude --resume 继续。注意插件不会安装 claude 命令，要在终端里用还得单独装命令行版。

只在 settings.json 里配置第三方 API，插件为什么还要求登录？

~/.claude/settings.json 里的环境变量会传给插件启动的 Claude Code 进程，但插件自己的登录检查读不到。所以 VS Code 插件接入第三方 API 要把变量写在 claudeCode.environmentVariables 里。

Cline、Continue 这类 VS Code 插件能用 cdnd 的 Key 吗？

不能。cdnd 只转发 Claude Code 本身发出的请求，其他客户端会收到 403 "cdnd serves Claude Code only"。Claude Code 的 VS Code 插件内置的就是 Claude Code，可以正常使用。

在 VS Code 里用 Claude Code 怎么收费？

用 cdnd 时按实际用量计费，价格就是 Anthropic 官方的美元标价，充值 ¥2 = $1，100 元起充，没有月费。输入 /usage 可以查看本次会话的花费。

卸载插件后为什么又自动装回来了？

在 VS Code 的集成终端里运行 claude 时，Claude Code 会自动安装插件。想保持卸载，在 /config 里关闭 Auto-install IDE extension，或者把 autoInstallIdeExtension 设置为 false。