Claude Code VS Code 扩展将 AI 编码能力直接集成到你最熟悉的 IDE 中，提供内联差异审查、@-提及文件、方案审阅、对话历史和键盘快捷键等原生图形界面体验。
安装前提
- VS Code 1.98.0 或更高版本
- Anthropic 账户（或配置的第三方云提供商）
安装方式
方式 1：直接链接安装
方式 2：扩展市场安装
- 按
Cmd+Shift+X（Mac）或Ctrl+Shift+X（Windows/Linux）打开扩展视图 - 搜索「Claude Code」
- 点击「安装」
安装后若扩展未出现，重启 VS Code 或运行「开发者：重新加载窗口」。
打开 Claude Code 面板
三种方式打开 Claude Code：
- 编辑器工具栏：点击编辑器右上角的 Spark（⚡）图标（需要打开文件）
- 命令面板：
Cmd+Shift+P→ 输入「Claude Code」→ 选择「在新标签页中打开」 - 状态栏：点击窗口右下角的「✱ Claude Code」（即使没有打开文件也可用）
首次打开面板时会显示「学习 Claude Code」清单，按引导完成入门或点击 X 关闭。后续可在 VS Code 设置 → 扩展 → Claude Code 中取消勾选「隐藏入门」来重新打开。
核心功能
内联差异审查
Claude 修改文件时，VS Code 扩展以内联方式展示变更：
- 在编辑器中直接高亮显示添加（绿色）和删除（红色）的内容
- 可以接受或拒绝单个代码块的修改
- 不需要在终端和编辑器之间切换
@-提及文件
在提示框中输入 @ 添加文件上下文：
@src/auth/login.ts 这个函数有什么安全问题？还支持：
@src/auth/login.ts:15-30：引用特定行范围- 从编辑器选择直接添加到对话
方案审阅（Plan Review）
在 Claude 执行修改前审阅其计划：
- Claude 提出变更计划
- 你可以在 VS Code 界面中编辑或批准计划
- 批准后 Claude 才开始实际执行
对话历史
- 通过侧边栏访问历史对话
- 在不同标签页或窗口中打开多个对话
- 每个对话有独立的上下文和文件状态
键盘快捷键
| 快捷键 | 功能 |
|---|---|
Cmd+K（Mac）/ Ctrl+K（Windows/Linux） | 触发内联编辑 |
Cmd+I（Mac）/ Ctrl+I（Windows/Linux） | 打开 Claude Code 面板 |
Escape | 关闭面板或取消当前操作 |
详细快捷键可在 VS Code 键盘快捷键设置中搜索「Claude Code」查看和自定义。
内联编辑（Inline Edits）
VS Code 扩展支持直接在编辑器中触发内联编辑：
- 选中要修改的代码
- 按
Cmd+K（Mac）或Ctrl+K（Windows/Linux） - 输入修改描述
- Claude 在当前文件中直接生成差异
- 在内联差异视图中接受或拒绝
内联编辑示例
# 选中一个函数，按 Cmd+K 后输入：
add error handling and JSDoc comments
# 选中一段复杂逻辑，按 Cmd+K 后输入：
refactor to use async/await instead of callbacks配置第三方提供商
如果通过 Amazon Bedrock 或 Google Vertex AI 使用 Claude：
- 打开 VS Code 设置（
Cmd+,） - 搜索「Claude Code」
- 在「Provider」设置中选择
Bedrock或Vertex - 配置对应的凭证
VS Code 扩展 vs CLI 对比
| 功能 | VS Code 扩展 | CLI |
|---|---|---|
| 内联差异审查 | ✅ 原生集成 | 需切换 |
| @-提及文件 | ✅ 自动补全 | 手动输入 |
| 方案审阅 | ✅ 图形界面 | 文本界面 |
| 对话历史 | ✅ 侧边栏 | /resume |
| 实时代码建议 | ✅ | ❌ |
| 脚本集成 | 有限 | ✅ |
| 自定义 Hook | 通过设置 | ✅ 完整支持 |
| 终端命令执行 | ✅ 集成终端 | ✅ |
扩展包含 CLI（命令行界面），可从 VS Code 集成终端访问 CLI 的高级功能。
使用技巧
1. 充分利用代码选择上下文
在代码中选择特定内容，然后提问会更精准：
# 选中 UserController 类后打开 Claude Code 面板
为这个 Controller 添加速率限制中间件2. 利用多标签页会话
- 在一个标签页进行功能开发
- 在另一个标签页进行代码审查
- 两个上下文互不干扰
3. 配合 CLAUDE.md 获得最佳体验
项目根目录的 CLAUDE.md 文件会被 VS Code 扩展自动读取，确保 Claude 了解你的项目规范：
## 技术栈
- React 18 + TypeScript
- Tailwind CSS
- Vitest 测试框架
## 代码规范
- 使用函数组件
- 状态使用 Zustand
- API 调用使用 TanStack Query4. 善用方案审阅
对于重要修改，利用方案审阅功能确认 Claude 理解了需求，再让它执行：
before making any changes, show me your plan for refactoring the auth module故障排除
- 扩展未出现：重启 VS Code 或运行「开发者：重新加载窗口」
- 无法连接：检查网络和 API key 配置
- 性能问题：尝试
/compact压缩对话历史
总结
Claude Code VS Code 扩展将 AI 编码助手深度集成到开发环境中，通过内联差异审查、@-提及和方案审阅等原生功能，让 AI 辅助开发更加直观高效。结合项目 CLAUDE.md 配置和合理的会话管理，可以将 AI 编程辅助无缝融入你的日常开发工作流。
来源：Claude Code 官方文档 - VS Code Extension 原文作者：Anthropic Team