在 VS Code 中使用Claude Code意味着你可以把大模型的编码能力真正“嵌入”到日常开发流程中而不是停留在浏览器里来回复制代码。Claude Code for VSCode 是 Anthropic 官方推出的 VS Code 扩展它为 Claude Code 提供了原生的图形化交互界面能够直接在 IDE 内完成代码理解、修改、规划和审查是目前在 VS Code 中使用 Claude Code 的推荐方式。通过该扩展你不仅可以像使用普通 AI 聊天工具一样向 Claude 提问还可以让它直接读取并理解当前项目的真实代码上下文。扩展支持内联差异Inline Diff展示修改结果在真正写入文件之前你可以清晰地看到 Claude 打算做哪些改动支持使用 提及文件、文件夹甚至精确到某个行号范围让 Claude“只看你想让它看的代码”同时还引入了“计划Plan”与“权限模式”的概念在执行任何自动修改前先给出完整方案由你确认后再动手最大程度保证代码安全性和可控性。在本教程中我们将从Claude Code for VSCode 的安装与基础使用开始逐步讲清楚扩展的核心功能和使用方式然后重点讲解国内用户和企业环境中最常见、也是最容易踩坑的部分——如何配置“AI 中转 / 神马中转 API”包括不同登录与接入方案的区别、settings.json 的正确写法以及常见问题的排查方法帮助你在 VS Code 中稳定、顺畅地使用 Claude Code 完成真实开发任务。安装Claude Code for VSCodeVS Code 版本要求1.98.0。扩展安装扩展商店搜索“Claude Code”→ 安装 → 必要时重启或 Developer: Reload Window。打开面板编辑器右上角会出现Spark 图标也可以命令面板输入 “Claude Code” 打开。配置“神马中转API”实际有三种登录方式本质就是要通过认证你才能使用点击选项卡会提示你跳转到对应的说明文档如下图所示我们其实可以直接配置API KEY、BASE URL比如接入神马中转API模型点这个插件的设置齿轮进去然后找到 在 settings.json 中编辑 点进去如下图所示 BASE URL神马中转API官网https://api.whatai.cc添加如下内容保存 settings.json 后先退出 VSCode再重新进入。{ name: ANTHROPIC_AUTH_TOKEN, value: sk-xxxxxxx }, { name: ANTHROPIC_BASE_URL, value: https://api.whatai.cc },最后测试在 VSCode 中成功使用 Claude Code 插件开始使用安装后您可以通过 VS Code 界面开始使用 Claude Code1.打开 Claude Code 面板在整个 VS Code 中Spark 图标表示 Claude CodeSpark 图标 打开 Claude 的最快方式是点击编辑器工具栏编辑器右上角中的 Spark 图标。该图标仅在您打开文件时出现。打开 Claude Code 的其他方式 命令面板CmdShiftPMac或 CtrlShiftPWindows/Linux输入”Claude Code”然后选择一个选项如”在新选项卡中打开” 状态栏点击窗口右下角的 ✱ Claude Code。即使没有打开文件也可以使用。 您可以拖动 Claude 面板在 VS Code 中重新定位。2.发送提示要求 Claude 帮助您处理代码或文件无论是解释某些内容的工作原理、调试问题还是进行更改。Claude 会自动看到您选择的文本。按 OptionKMac/ AltKWindows/Linux也可以在您的提示中插入 -提及引用如 file.ts#5-10。以下是询问文件中特定行的示例3.审查更改当 Claude 想要编辑文件时它会显示原始内容和建议更改的并排比较然后请求许可。您可以接受、拒绝或告诉 Claude 改为做什么。VS Code 显示 Claude 建议更改的差异带有权限提示询问是否进行编辑Claude Code for VSCode 详细使用教程高频功能打开与多会话Spark 图标快速打开面板也可命令面板打开。支持“在新选项卡/新窗口打开”多会话并行处理任务。 引用文件/文件夹让它“读代码”输入 文件名/目录名可引用内容支持模糊匹配。OptionK / AltK 可插入带行号范围的引用如 app.ts#5-10。权限模式强烈建议你先用 Plan提示框底部可切换模式default每步操作都询问许可plan先给计划等你确认再动手acceptEdits / bypass更激进风险更高也可以在 VS Code 设置里用 claudeCode.initialPermissionMode 设默认值。Slash 命令菜单/在输入框里输入 / 打开命令菜单附加文件、切模型、扩展思考、/usage 等。终端模式CLI 风格扩展默认是图形聊天面板你可以在扩展设置里勾选useTerminal切到终端模式。扩展设置 vs Claude Code 设置别配错地方官方区分得很清楚VS Code 扩展设置控制扩展在 VS Code 内的行为如 disableLoginPrompt、useTerminal、initialPermissionMode 等。~/.claude/settings.json扩展与 CLI 共享环境变量、允许的命令、hooks、MCP servers、plugins 等。修复常见问题扩展无法安装确保您有兼容版本的 VS Code1.98.0 或更高版本 检查 VS Code 是否有权安装扩展 尝试从 VS Code Marketplace 直接安装Spark 图标不可见Spark 图标在您打开文件时出现在编辑器工具栏编辑器右上角中。如果您看不到它 打开文件该图标需要打开文件。仅打开文件夹是不够的。 检查 VS Code 版本需要 1.98.0 或更高版本帮助 → 关于 重启 VS Code从命令面板运行”Developer: Reload Window” 禁用冲突的扩展临时禁用其他 AI 扩展Cline、Continue 等 检查工作区信任扩展在受限模式下不工作 或者点击状态栏右下角中的”✱ Claude Code”。即使没有打开文件也可以使用。您也可以使用命令面板CmdShiftP / CtrlShiftP并输入”Claude Code”。 Claude Code 从不响应如果 Claude Code 没有响应您的提示 检查您的互联网连接确保您有稳定的互联网连接 开始新对话尝试开始新对话以查看问题是否仍然存在 尝试 CLI从终端运行 claude 以查看是否获得更详细的错误消息 如果问题仍然存在请在 GitHub 上提交问题并提供有关错误的详细信息。 卸载扩展要卸载 Claude Code 扩展 打开扩展视图Mac 上为 CmdShiftX 或 Windows/Linux 上为 CtrlShiftX 搜索”Claude Code” 点击卸载 要也删除扩展数据并重置所有设置rm -rf ~/.vscode/globalStorage/anthropic.claude-code
