Claude Code 另一种桌面：VS Code 插件版安装和配置指南。图形界面，鼠标点点就能用，所见即所得。

插件版 vs 终端版对比

维度	插件版	终端版
界面	图形界面	命令行
操作方式	鼠标点点	命令输入
代码对比	Diff 对比弹窗	纯文本
计划审批	审批面板	命令行确认
文件引用	@ 符号快速引用	手动路径
适用人群	不习惯命令行	习惯命令行

六步安装流程

┌─────────────────────────────────────────────────────────────┐
│              Claude Code VS Code 插件版安装流程                │
├─────────────────────────────────────────────────────────────┤
│                                                             │
│   Step 1：安装 VS Code                                     │
│   Step 2：安装 Claude Code 插件                             │
│   Step 3：安装 CC-Switch（可选）                            │
│   Step 4：配置 API Keys                                    │
│   Step 5：连接 DeepSeek（可选）                            │
│   Step 6：验证安装                                         │
│                                                             │
└─────────────────────────────────────────────────────────────┘

Step 1：安装 VS Code

什么是 VS Code

VS Code 是微软出的免费代码编辑器：

• 开源、跨平台（Windows/Mac/Linux）
• 轻快不臃肿
• 全球使用人数最多
• 插件生态最丰富

下载地址

官网：https://code.visualstudio.com/download

平台	安装包
Windows	点左边第一个安装包
Mac	下载 .dmg 文件

安装中文界面

1. 点击左边竖排图标栏的"扩展"（四个方块）
2. 搜索 "Chinese"
3. 选择 "Chinese (Simplified)"
4. 点 "install"
5. 重启 VS Code

如果中文界面没出现：

1. 按 Ctrl+Shift+P 打开命令面板
2. 键入 "display"
3. 选择 "Configure Display Language"
4. 选择 "中文(简体)"

版本要求：1.98.0 以上

Step 2：安装 Claude Code 插件

1. 打开 VS Code 扩展（Ctrl+Shift+X）
2. 搜索 "Claude Code"
3. 找到官方插件
4. 点击安装

验证安装

安装完成后，在 VS Code 左侧边栏会看到 Claude 图标。

Step 3：安装 CC-Switch（可选）

如果已经装过 Claude Code 终端版，这步可以跳过。

CC-Switch 是什么

CC-Switch 是一个模型切换工具，可以：

• 管理多个 API Keys
• 切换不同的模型后端
• 支持 DeepSeek 等国内 API

安装方法

# npm 安装
npm install -g cc-switch

# 或 Homebrew 安装
brew install cc-switch

配置 DeepSeek API

# 添加 DeepSeek
cc-switch add-provider deepseek --api-key sk-xxxx

# 设置默认模型
cc-switch set-default deepseek/deepseek-v4

Step 4：配置 API Keys

配置 Anthropic API

1. 在 VS Code 中打开 Claude Code 插件
2. 点击设置图标
3. 找到 "API Key" 配置项
4. 输入你的 Anthropic API Key

获取 API Key

1. 访问 Anthropic 官网
2. 登录账号
3. 进入 API Keys 页面
4. 创建新的 API Key
5. 复制并保存

注意：API Key 只显示一次，请妥善保存。

Step 5：连接 DeepSeek（可选）

如果你想用 DeepSeek 而不用 Claude 官方账号：

方法一：CC-Switch 配置

# 配置 DeepSeek
cc-switch add-provider deepseek --api-key sk-xxxx

# 设置 DeepSeek 为默认
cc-switch set-default deepseek/deepseek-v4

方法二：VS Code 插件配置

1. 打开 Claude Code 插件设置
2. 找到 "Model Provider"
3. 选择 "Custom"
4. 配置 DeepSeek 的 API Endpoint

{
  "claude-code.provider": "custom",
  "claude-code.endpoint": "https://api.deepseek.com",
  "claude-code.model": "deepseek-chat-v4"
}

Step 6：验证安装

基本验证

1. 打开一个项目文件夹
2. 点击 VS Code 左侧的 Claude 图标
3. 在输入框输入问题
4. 查看回复

完整功能验证

功能	验证方法
代码生成	让 Claude 写一段代码
Diff 对比	让 Claude 修改代码，查看对比弹窗
文件引用	使用 @ 符号引用文件
计划审批	让 Claude 制定计划，查看审批面板

实用碎碎念

插件版的优势

优势	说明
所见即所得	改代码弹 Diff 对比，接受与否你来定
计划审批	制定计划有审批面板，不会乱来
快速引用	@ 符号快速引用文件和终端输出
语境自动	打开项目文件夹，Claude 自动理解上下文

常见问题

问题	解决方案
插件没反应	检查 API Key 是否配置正确
看不到中文	重启 VS Code 或重新安装中文插件
代码修改没生效	点击 "Accept" 接受修改
模型切换失败	检查 CC-Switch 配置

快捷键

快捷键	功能
Ctrl+Shift+A	打开 Claude 对话框
@	引用文件
#	引用终端输出

一句话总结

Claude Code VS Code 插件版 = 图形界面的 Claude Code，鼠标点点就能用。

6 步安装：装 VS Code → 装插件 → 装 CC-Switch → 配置 API → 连 DeepSeek → 验证。

核心优势：所见即所得、Diff 对比、计划审批、快速引用。