VS代码扩展为 Claude Code 提供了本机图形界面,直接集成到您的 IDE 中。这是在 VS Code 中使用 Claude Code 的推荐方式。通过该扩展,您可以在接受之前查看和编辑 Claude 的计划、自动接受所做的编辑、@ 提及您选择的具有特定行范围的文件、访问对话历史记录以及在单独的选项卡或窗口中打开多个对话。
安装之前,请确保您拥有:
VS 代码 1.98.0 或更高版本
单击您的 IDE 的链接直接安装:
安装 VS Code 安装光标
安装完成后,您可以通过 VS Code 界面开始使用 Claude Code:
有关可以使用 Claude Code 执行哪些操作的更多想法,请参阅常见工作流程。
提示框支持多种功能:
权限模式:点击提示框底部的模式指示灯可切换模式。在正常模式下,克劳德在每次行动之前都会征求许可。在计划模式下,克劳德描述它将做什么,并在进行更改之前等待批准。 VS Code 会自动将计划作为完整的 Markdown 文档打开,您可以在其中添加内联注释以在 Claude 开始之前提供反馈。在自动接受模式下,克劳德无需询问即可进行编辑。在“claudeCode.initialPermissionMode”下的 VS Code 设置中设置默认值。
命令菜单:单击“/”或键入“/”打开命令菜单。选项包括附加文件、切换模型、切换扩展思维、查看计划使用情况 (/usage) 以及启动 远程控制 会话 (/remote-control)。自定义部分提供对 MCP 服务器、挂钩、内存、权限和插件的访问。带有终端图标的项目在集成终端中打开。
上下文指示器:提示框显示您正在使用多少克劳德的上下文窗口。 Claude 在需要时自动压缩,或者您可以手动运行“/compact”。
扩展思考:让克劳德花更多的时间
通过复杂的问题进行推理。通过命令菜单(/)将其打开。有关详细信息,请参阅扩展思维。
多行输入:按Shift+Enter添加新行而不发送。这也适用于问题对话框的“其他”自由文本输入。
使用 @-提及为 Claude 提供有关特定文件或文件夹的上下文。当您键入“@”后跟文件或文件夹名称时,Claude 会读取该内容并可以回答有关它的问题或对其进行更改。 Claude Code 支持模糊匹配,因此您可以输入部分名称来查找您需要的内容:
解释一下@auth中的逻辑(模糊匹配auth.js、AuthService.ts等) @src/components/ 中有什么(包括文件夹的尾部斜杠)
对于大型 PDF,您可以要求 Claude 阅读特定页面而不是整个文件:单个页面、第 1-10 页等范围或第 3 页以后的开放式范围。当您在编辑器中选择文本时,Claude 可以自动看到突出显示的代码。提示框页脚显示选择了多少行。按“Option+K”(Mac)/“Alt+K”(Windows/Linux)插入带有文件路径和行号的@提及(例如“@app.ts#5-10”)。单击选择指示器可切换 Claude 是否可以看到突出显示的文本 - 斜线图标表示 Claude 无法看到所选内容。您还可以在按住“Shift”的同时将文件拖到提示框中以将其添加为附件。单击任意附件上的 X 可将其从上下文中删除。
启动并运行后,您可以重新定位 Claude 面板、运行多个会话或切换到终端模式。
您可以拖动 Claude 面板将其重新放置在 VS Code 中的任何位置。抓住面板的选项卡或标题栏并将其拖动到:
辅助侧边栏:窗口的右侧。在您编码时让 Claude 保持可见。 编辑器区域:将 Claude 作为文件旁边的选项卡打开。对于副任务很有用。
使用命令面板中的 在新选项卡中打开 或 在新窗口中打开 启动其他对话。每个对话都维护自己的历史记录和上下文,允许您并行处理不同的任务。使用选项卡时,火花图标上的小彩色点指示状态:蓝色表示权限请求正在等待处理,橙色表示 Claude 在选项卡隐藏时已完成。
默认情况下,扩展程序会打开图形聊天面板。如果您喜欢 CLI 风格的界面,请打开 使用终端设置 并选中复选框。您还可以打开 VS Code 设置(Mac 上为“Cmd+,”,Windows/Linux 上为“Ctrl+,”),转到扩展 → Claude Code,然后选中 使用终端。
VS Code 扩展包括用于安装和管理插件的图形界面(https://code.claude.com/docs/en/plugins)。在提示框中输入“/plugins”,打开**管理插件**界面。
插件对话框显示两个选项卡:插件和市场。在插件选项卡中:
安装的插件显示在顶部,并带有切换开关以启用或禁用它们 您配置的市场中的可用插件显示在下面 在任何可用插件上单击“安装”
安装插件时,选择安装范围:
为您安装:可用于您的所有项目(用户范围) 为此项目安装:与项目合作者共享(项目范围) 本地安装:仅适用于您,仅在此存储库中(本地范围)
切换到 Marketplaces 选项卡以添加或删除插件源:
输入 GitHub 存储库、URL 或本地路径以添加新市场 单击刷新图标可更新市场的插件列表 单击垃圾桶图标可删除市场
进行更改后,横幅会提示您重新启动 Claude Code 以应用更新。
有关插件系统的更多信息,请参阅插件和插件市场。
将 Claude 连接到 Chrome 浏览器,以测试 Web 应用程序、使用控制台日志进行调试以及自动化浏览器工作流程,而无需离开 VS Code。这需要 Claude in Chrome 扩展 版本 1.0.36 或更高版本。在提示框中键入“@browser”,然后输入您希望 Claude 执行的操作:
@browser 转到 localhost:3000 并检查控制台是否有错误
打开命令面板(Mac 上为“Cmd+Shift+P”,Windows/Linux 上为“Ctrl+Shift+P”)并键入“Claude Code”以查看 Claude Code 扩展的所有可用 VS Code 命令。某些快捷方式取决于哪个面板“聚焦”(接收键盘输入)。当光标位于代码文件中时,编辑器将获得焦点。当你的光标位于克劳德的提示框中时,克劳德就获得了焦点。使用“Cmd+Esc”/“Ctrl+Esc”在它们之间切换。
| 命令 | 快捷方式 | 描述 |
|---|---|---|
| 焦点输入 | Cmd+Esc (Mac) / Ctrl+Esc (Windows/Linux) | 在编辑器和 Claude 之间切换焦点 |
| 在侧边栏打开 | - | 在左侧边栏打开克劳德 |
| 在终端中打开 | - | 在终端模式下打开 Claude |
| 在新选项卡中打开 | Cmd+Shift+Esc (Mac) / Ctrl+Shift+Esc (Windows/Linux) | 作为编辑器选项卡打开新对话 |
| 在新窗口中打开 | - | 在单独的窗口中打开新对话 |
| 新对话 | Cmd+N (Mac) / Ctrl+N (Windows/Linux) | 开始新的对话(需要克劳德集中注意力) |
| 插入@-提及参考 | Option+K (Mac) / Alt+K (Windows/Linux) | 插入对当前文件和选择的引用(需要编辑器聚焦) |
| 显示日志 | - | 查看扩展调试日志 |
| 退出 | - | 退出您的 Anthropic 帐户 |
该扩展在 vscode://anthropic.claude-code/open 处注册了一个 URI 处理程序。使用它可以从您自己的工具中打开一个新的 Claude Code 选项卡:shell 别名、浏览器书签或任何可以打开 URL 的脚本。如果 VS Code 尚未运行,则打开 URL 会首先启动它。如果 VS Code 已在运行,则 URL 将在当前聚焦的窗口中打开。使用操作系统的 URL 打开程序调用处理程序。在 macOS 上:
打开“vscode://anthropic.claude-code/open”
在 Linux 上使用 xdg-open 或在 Windows 上使用 start。处理程序接受两个可选查询参数:
| 参数 | 描述 |
|---|---|
提示 | 预先填写提示框的文本。必须是 URL 编码的。提示是预先填写的,但不会自动提交。 |
会话 | 要恢复而不是开始新对话的会话 ID。该会话必须属于当前在 VS Code 中打开的工作区。如果未找到会话,则会开始新的对话。如果会话已在选项卡中打开,则该选项卡将获得焦点。要以编程方式捕获会话 ID,请参阅继续对话。 |
例如,要打开一个预填充“查看我的更改”的选项卡:
vscode://anthropic.claude-code/open?prompt=review%20my%20changes
该扩展有两种类型的设置:
VS Code 中的扩展设置:控制 VS Code 中的扩展的行为。使用 Cmd+, (Mac) 或 Ctrl+, (Windows/Linux) 打开,然后转到扩展 → Claude Code。你可以