第 3 章：环境搭建

在第 2 章中，我们理解了 Agent 与模型的分离关系——Agent 是框架，模型是大脑。本章将把理论变成现实：在 VSCode 中安装 Claude Code，配置 cc-switch 接入 DeepSeek API，跑通第一个对话，并对整个操作界面建立完整的认知。

本章目标：完成 Claude Code 的完整安装与配置，理解 VSCode 扩展的操作界面，掌握模型切换的基本方法。

3.1 前置依赖

Claude Code 作为 Node.js 应用，对运行环境有一套最低要求。在动手安装之前，先确认以下条件全部满足。

依赖	最低版本	说明
Node.js	22.x+	Claude Code CLI 运行环境
Git	2.23+	版本控制，用于文件变更追踪
网络	—	翻墙

对于 VSCode 用户，需要 VSCode 1.82+。

为什么需要这些依赖？

Node.js 22.x+：Claude Code 基于 Node.js 运行，依赖较新版本的 JavaScript 运行时特性。如果版本过低，扩展启动时会直接报错。
Git 2.23+：Claude Code 的文件编辑工作流深度依赖 Git——它通过 git diff 展示修改，通过 git status 追踪变更状态。2.23 以上版本提供了 git restore 等 Claude Code 内部使用的命令。
网络（翻墙）：Claude Code 需要访问 Anthropic API。如果你使用 DeepSeek 作为模型服务商（无需翻墙），则此要求可放宽。

快速验证命令：

bash

node --version   # 应输出 >= v22.0.0
git --version    # 应输出 >= 2.23.0

3.2 安装 Claude Code for VSCode

为什么选择 VSCode 扩展而不是 CLI？ VSCode 扩展提供了 IDE 深度融合的体验：侧边栏对话面板、文件 Diff 视图、内联编辑、右键菜单等。CLI 版本适合远程服务器场景，但在本地开发中，扩展版本是更高效的选择。关于五种使用方式的详细对比，见第 4 章。

安装扩展

打开 VSCode，进入扩展市场（Cmd+Shift+X）
搜索 "Claude Code"
选择 Anthropic 官方发布的扩展，点击安装
重启 VSCode 插件

或者通过命令行安装：

bash

code --install-extension anthropic.claude-code

初始设置

安装后会提示登录。使用 cc-switch（见 3.3 节）或手动配置（见 3.6 节）切换模型后，即可接入 DeepSeek 等第三方模型。

如果你是第一次接触 Claude Code：不用担心，本章将引导你完成每一步配置。即便还没有 API Key，也可以先把扩展安装好，配置工作稍后进行。

3.3 安装 cc-switch

为什么需要 cc-switch？ 手动编辑 ~/.claude/settings.json 只能配置一家模型服务商。如果你的日常工作需要在 DeepSeek（省钱、处理日常任务）和 Anthropic 官方模型（复杂推理、高质量代码审查）之间切换，每次都手改 JSON 文件将极其低效。

cc-switch 是一个可视化的模型切换工具，通过 GUI 配置界面管理 Claude Code 使用的 AI 模型，解决了在快速任务（用小模型省钱）和复杂重构（用大模型保质量）之间高效切换的痛点。

下载与安装

从 GitHub Releases 页面下载：https://github.com/farion1231/cc-switch/releases，在 Assets 部分选择：

安装包：CC-Switch-v{version}-Windows.msi（Windows 安装程序）
免安装包：CC-Switch-v{version}-Windows-Portable.zip（解压即用）

安装完成后启动 cc-switch，你将看到一个简洁的模型管理界面。

3.4 配置 DeepSeek API 接入

DeepSeek 是深度求索开发的 AI 模型系列，其 API 通过 Anthropic 兼容格式 提供服务。配合 cc-switch 或手动配置，可将 Claude Code 的底层模型替换为 DeepSeek，在保留 Claude Code Agent 框架（工具编排、文件操作、权限控制等）的同时，使用 DeepSeek 的推理能力。

为什么要用 DeepSeek？ 一句话：性价比。DeepSeek V4 Flash 的输出价格仅为 Claude Sonnet 4.6 的 1/53。对于日常开发中的代码生成、简单重构、问题诊断等任务，V4 Flash 的表现完全够用。而当你需要极致的推理深度时，再切换回 Claude Opus。这种"双模型策略"是当前最高效的使用方式。

DeepSeek 开放平台：https://platform.deepseek.com/

DeepSeek V4 系列

2026 年 4 月，DeepSeek 发布了 V4 系列 的两个模型：

特性	DeepSeek V4 Flash	DeepSeek V4 Pro
定位	轻量快速、高吞吐	高性能、强推理
上下文	1M tokens	1M tokens
最大输出	384K tokens	384K tokens
思考模式	支持（默认开启）	支持（默认开启）
工具调用	✅	✅
并发限制	2,500	500
OpenRouter 排名	2026 年 5 月登顶	—

定价对比

2026 年 5 月，DeepSeek 宣布 永久降价 75%，V4 Flash 的定价极具竞争力。

计费项（每 1M tokens）	DeepSeek V4 Flash	DeepSeek V4 Pro	Claude Sonnet 4.6	Claude Opus 4.7
输入（缓存命中）	¥0.02	¥0.025 ↓	¥1.05	¥10.50
输入（缓存未命中）	¥1.00	¥3.00 ↓	¥21.00	¥105.00
输出	¥2.00	¥6.00 ↓	¥105.00	¥525.00

💡 V4 Flash 的输出价格仅为 Claude Sonnet 4.6 的 1/53，Claude Opus 4.7 的 1/263。V4 Pro 当前享受 75% 补贴价，2026/05/31 后调整为正式价：输入 ¥12.00，输出 ¥24.00（仍远低于 Anthropic 官方模型）。

模型选择建议

场景	推荐模型	理由
日常开发、简单重构	DeepSeek V4 Flash	极低成本，足够好的代码能力
复杂架构设计、深度推理	Claude Opus 4.7	推理深度不可替代
高质量代码生成	DeepSeek V4 Pro / Claude Sonnet 4.6	两者各有所长
高频调用、批量处理	DeepSeek V4 Flash	2500 并发 + 极低缓存价格

获取 API Key

在 DeepSeek 开放平台创建和管理 API Keys：https://platform.deepseek.com/api_keys

注册/登录 DeepSeek 开放平台
进入 API Keys 页面，点击「创建 API Key」
复制生成的 sk-xxx 密钥并妥善保存（密钥仅显示一次）

GUI 配置步骤

打开 cc-switch，按以下步骤配置 DeepSeek 接入：

选中 Claude Code——左侧应用列表中选择 Claude Code
添加模型——注意：Anthropic 官方模型已内置，直接切换即可；添加的是第三方模型
选中 DeepSeek，填写 API 端点和密钥：
- API endpoint：https://api.deepseek.com/anthropic
- API key：sk-xxx（替换为上一步获取的密钥）
配置 Claude Code 模型映射：
- Haiku（快） → deepseek-v4-flash
- Sonnet（平衡） → deepseek-v4-flash 或 deepseek-v4-pro（根据需要选择）
- Opus（强推理） → deepseek-v4-pro[1m]
保存配置：确保开关已开启
拖动顺序：列表顶部的模型将成为当前使用的模型，拖动即可切换

注意：cc-switch 本质上是在修改 Claude Code 的配置文件（~/.claude/settings.json）。如果你更习惯手动编辑 JSON，可以跳过 cc-switch，直接参考 3.6 节的手动配置方式。

3.5 配置 Anthropic 官方 API（双账号策略）

为什么需要双账号？ 正如上一节的模型选择建议所示：日常任务用 DeepSeek V4 Flash（极低成本），复杂推理用 Claude Opus（不可替代的深度）。cc-switch 的价值正在于此——让你在两种配置之间无缝切换。

在 cc-switch 中同时配置两家

Anthropic 官方：cc-switch 已内置 Anthropic 官方模型，只需填入你的 Anthropic API Key 即可使用。无需额外添加模型。
DeepSeek：按 3.4 节的步骤添加。
切换：在 cc-switch 的模型列表中，将当前想使用的模型拖到列表顶部。VSCode 中的 Claude Code 在下次对话时自动使用新模型。

典型使用模式

时段/场景	模型选择	理由
日常编码、CRUD 开发	DeepSeek V4 Flash	便宜够用、响应快
复杂算法、架构评审	Claude Opus 4.7	推理深度是刚需
代码审查	Claude Sonnet 4.6	平衡质量与成本
学习理解代码	DeepSeek V4 Flash/Pro	大量 token 消耗，用便宜的
生成生产级代码	Claude Sonnet / Opus	对输出质量要求高，值得多花一点

3.6 手动配置方式（可选）

如果你不使用 cc-switch，或者希望深入理解配置的底层机制，可以直接编辑 ~/.claude/settings.json。

为什么了解手动配置？ 它让你理解 cc-switch 究竟做了什么——掌握这个原理后，排查配置问题会更得心应手。此外，在 CI/CD 或远程服务器环境中（没有 GUI），手动配置是唯一的方式。

DeepSeek 配置示例

json

{
  "env": {
    "ANTHROPIC_AUTH_TOKEN": "sk-xxx",
    "ANTHROPIC_BASE_URL": "https://api.deepseek.com/anthropic",
    "ANTHROPIC_DEFAULT_HAIKU_MODEL": "deepseek-v4-flash",
    "ANTHROPIC_DEFAULT_OPUS_MODEL": "deepseek-v4-pro[1m]",
    "ANTHROPIC_DEFAULT_SONNET_MODEL": "deepseek-v4-flash[1M]",
    "ANTHROPIC_DEFAULT_SONNET_MODEL_NAME": "deepseek-v4-flash",
    "ANTHROPIC_MODEL": "deepseek-v4-flash",
    "API_TIMEOUT_MS": "3000000",
    "CLAUDE_CODE_DISABLE_NONESSENTIAL_TRAFFIC": "1"
  },
  "model": "haiku"
}

关键环境变量说明

环境变量	说明
`ANTHROPIC_AUTH_TOKEN`	DeepSeek API 密钥（`sk-xxx`）
`ANTHROPIC_BASE_URL`	DeepSeek 的 Anthropic 兼容端点
`ANTHROPIC_DEFAULT_HAIKU_MODEL`	对应 Claude Code 中 "haiku" 选项的模型
`ANTHROPIC_DEFAULT_SONNET_MODEL`	对应 Claude Code 中 "sonnet" 选项的模型
`ANTHROPIC_DEFAULT_OPUS_MODEL`	对应 Claude Code 中 "opus" 选项的模型
`ANTHROPIC_MODEL`	默认使用的模型名称
`API_TIMEOUT_MS`	API 超时时间（毫秒），DeepSeek 推理较慢，建议设大些
`CLAUDE_CODE_DISABLE_NONESSENTIAL_TRAFFIC`	禁用非必要网络流量，设为 `"1"` 可避免遥测上报

完整的环境变量参考见 3.11 节。

切换到 Anthropic 官方

只需要改回 Anthropic 的配置：

json

{
  "env": {
    "ANTHROPIC_AUTH_TOKEN": "sk-ant-xxx",
    "ANTHROPIC_BASE_URL": "https://api.anthropic.com"
  },
  "model": "sonnet"
}

正是由于这种切换完全靠手工编辑 JSON，cc-switch 才有存在的意义。

DeepSeek 接入 Claude Code 官方文档：https://api-docs.deepseek.com/zh-cn/quick_start/agent_integrations/claude_code

3.7 第一个对话

现在一切就绪。让我们用第一个对话来验证安装是否成功。

打开 VSCode，进入你的项目
点击侧边栏的 Claude Code 图标，或按 Cmd+Shift+P 输入 Claude Code: Open in Side Bar
对话面板启动后，输入第一个问题：

介绍一下这个项目的结构

Claude Code 会自动读取项目文件（package.json、目录结构、.git 等），理解项目结构，然后给出回复。如果你看到一段结构化的分析——恭喜，环境搭建成功。

这个简单问题背后发生了什么？ Claude Code 启动后做了以下几件事：

读取项目根目录下的 CLAUDE.md（如果存在）获取项目上下文
读取 package.json、目录树等关键文件，建立项目认知
调用模型（你配置的 DeepSeek 或 Claude）生成回复
在回复中可能使用了 Read、Glob、Bash(ls) 等工具

这些工具的执行过程会在对话面板中实时显示——你会看到 Claude Code "使用工具"、"读取文件"等中间步骤。不要慌，这就是 Agent 在工作的样子。关于 Agent Loop 的完整解析，见第 10 章。

3.8 VSCode 界面导览

安装完成后，VSCode 侧边栏会出现 Claude Code 面板。这一节带你熟悉界面的每个区域。

侧边栏面板

侧边栏是主要工作区，包含三个核心区域：

对话区：

输入指令的地方，支持多行输入（Shift+Enter 换行，Enter 发送）
对话历史可滚动查看，Claude 的工具调用过程实时可见
支持 / 开头的斜杠命令

Diff 审查区：

Claude 修改代码后，每个文件以左右双栏 Diff 形式展示
顶部工具栏：Accept All / Reject All / 逐文件操作
可以在 Diff 视图中直接编辑（手动微调 Claude 的输出）
支持 Cmd+Z 撤销已接受的变更

终端输出区：

Claude 执行的每个 Shell 命令都可以展开查看完整输出
命令执行中可按 Ctrl+C 中断
失败的命令会高亮显示，方便定位问题

三种启动方式

方式	快捷键/操作	适用场景
命令打开	`Claude Code: Open in Side Bar`	针对特定代码的快速操作
图标打开	打开文件之后右上角 Claude Code 图标	多轮对话、复杂任务、需要查看 Diff
快捷键打开	`Cmd+Esc` 或 `Ctrl+Esc`	快速提问、光标处直接操作

使用建议：日常开发中，用 Cmd+Esc 快捷键最方便；需要审查多个文件修改时，从侧边栏打开以使用完整的 Diff 视图。

右键菜单功能

选中代码后右键，VSCode 扩展提供以下快捷入口：

菜单项	功能
Ask Claude	以选中代码为上下文提问
Explain This	解释选中代码的逻辑
Fix This	自动诊断并修复选中的问题代码
Add to Context	将选中代码加入当前对话上下文（不发送新消息）

这些快捷操作在第 5 章和第 6 章中会详细展开。

3.9 个人推荐设置

以下设置来自大量日常使用的经验总结。在 VSCode 的 settings.json（Cmd+, 打开设置，点击右上角切换到 JSON）中添加：

json

{
  // 在侧边栏显示 Claude Code 面板，保持工作区整洁
  "claudeCode.preferredLocation": "sidebar",
  // 启用新会话快捷键 Cmd/Ctrl+N
  "claudeCode.enableNewConversationShortcut": true,
  // 发送消息时使用 Ctrl+Enter，避免与 Enter 换行冲突（经常要打多行指令）
  "claudeCode.useCtrlEnterToSend": true,
  // 启动 bypassPermissions 模式，直接执行所有操作，无需每次确认（适合测试或完全信任的环境）
  "claudeCode.allowDangerouslySkipPermissions": true,
  // 直接跳过登录提示，适合已经通过环境变量配置好认证信息的用户
  "claudeCode.disableLoginPrompt": true,
  // 模型 permission 模式使用 bypassPermissions，直接执行所有操作，无需每次确认
  "claudeCode.initialPermissionMode": "bypassPermissions"
}

各设置详解

设置项	作用
`claudeCode.preferredLocation`	设为 `"sidebar"` 后，Claude Code 面板固定出现在侧边栏而非弹出窗口，方便同时查看代码和对话
`claudeCode.enableNewConversationShortcut`	允许 `Cmd+N` / `Ctrl+N` 快速创建新会话。对话变长、上下文膨胀后，开新会话比 `/clear` 更彻底
`claudeCode.useCtrlEnterToSend`	将发送从 `Enter` 改为 `Ctrl+Enter`。因为 Claude Code 中经常需要输入多行指令（带上下文、代码片段、约束条件），`Enter` 换行是高频操作
`claudeCode.allowDangerouslySkipPermissions`	开启后，所有操作无需逐次点击确认按钮。适合对 Claude Code 已有足够信任的用户。初学者建议先关闭，熟悉后再开启
`claudeCode.disableLoginPrompt`	跳过 VSCode 的登录弹窗。当你使用环境变量（如 `ANTHROPIC_AUTH_TOKEN`）或 cc-switch 配置 API 密钥时，登录弹窗是多余的
`claudeCode.initialPermissionMode`	设置初始权限模式为 `"bypassPermissions"`，启动时自动跳过权限确认。可用值：`"askBeforeEdit"` / `"editAutomatically"` / `"planMode"` / `"auto"`

关于权限模式的深入讨论，见第 14 章。

3.10 配置体系概览

Claude Code 的配置分为四个层级，优先级从高到低：

项目本地配置 (.claude/settings.local.json)     ← 最高优先级，不提交 Git
    ↓ 覆盖
项目配置 (.claude/settings.json)               ← 团队共享，提交 Git
    ↓ 覆盖
用户全局配置 (~/.claude/settings.json)          ← 个人偏好，所有项目生效
    ↓ 覆盖
内置默认值                                      ← 最低优先级

为什么需要四层配置？ 想象这个场景：团队项目要求使用 Claude Sonnet 4.6（写在 .claude/settings.json 中），但你个人更喜欢用 DeepSeek V4 Flash 做日常开发（写在 ~/.claude/settings.json 中），而本地测试环境需要用本地的测试 API 端点（写在 .claude/settings.local.json 中）。四层设计让每个层级各司其职，互不干扰。

各层简介

用户全局配置（~/.claude/settings.json）：存放个人偏好，对所有项目生效。

json

{
  "model": "claude-sonnet-4-6",
  "theme": "dark",
  "autoCompact": true,
  "permissions": {
    "allow": [
      "Bash(git:status)",
      "Bash(git:diff)",
      "Bash(git:log)",
      "Bash(npm:*)",
      "Bash(pnpm:*)"
    ],
    "deny": ["Bash(rm:-rf:*)", "Bash(sudo:*)", "Bash(git:push:--force:*)"]
  },
  "hooks": {
    "PreToolUse": [],
    "PostToolUse": []
  }
}

项目配置（.claude/settings.json）：项目根目录，存放团队共享的配置，提交到 Git。

json

{
  "model": "claude-sonnet-4-6",
  "permissions": {
    "allow": [
      "Bash(git:*)",
      "Bash(pnpm:*)",
      "Bash(node:*)",
      "WebSearch",
      "WebFetch"
    ],
    "deny": ["Bash(rm:-rf:*)", "Bash(sudo:*)"]
  },
  "enableAllProjectMcpServers": true
}

本地覆盖配置（.claude/settings.local.json）：本地覆盖配置，不提交到 Git，适合存放个人密钥、本地路径等敏感信息。

json

{
  "env": {
    "DATABASE_URL": "postgresql://localhost:5432/mydevdb",
    "DEBUG": "true"
  }
}

配置体系的完整参考见第 13 章。

3.11 环境变量参考

Claude Code 支持通过环境变量进行高级配置。以下是当前阶段（环境搭建）最重要的环境变量：

环境变量	说明
`ANTHROPIC_AUTH_TOKEN`	API 密钥（DeepSeek 填 `sk-xxx`）
`ANTHROPIC_BASE_URL`	自定义 API 端点（代理/私有部署）
`ANTHROPIC_MODEL`	默认使用的模型名称
`API_TIMEOUT_MS`	API 超时时间（毫秒）
`CLAUDE_CODE_MAX_OUTPUT_TOKENS`	单次输出最大 token 数
`CLAUDE_CODE_DISABLE_TELEMETRY`	禁用遥测（设为 `1`）
`NO_COLOR`	禁用 CLI 彩色输出（设为 `1`）

在 VSCode 中，还可以通过 .vscode/settings.json 设置环境变量：

json

{
  "claude-code.environment": {
    "ANTHROPIC_BASE_URL": "https://your-proxy.example.com"
  }
}

完整的环境变量参考见附录 C。

VSCode 快捷键参考

Claude Code for VSCode 提供丰富的快捷键支持：

快捷键	操作
`Cmd+Shift+L`	打开侧边栏对话面板
`Cmd+Shift+I`	打开内联编辑输入框
`Enter`	发送消息
`Shift+Enter`	消息内换行
`Ctrl+C`	中断 Claude 当前操作
`Cmd+K`	选中代码后打开上下文菜单
`Tab`	接受内联编辑建议
`Escape`	拒绝内联编辑建议 / 关闭面板

自定义快捷键

在 VSCode 中 Cmd+K Cmd+S 打开快捷键设置，搜索 Claude Code 即可自定义所有绑定。社区推荐的额外绑定：

json

// keybindings.json
[
  {
    "key": "cmd+shift+r",
    "command": "claude-code.reviewSelection"
  },
  {
    "key": "cmd+shift+e",
    "command": "claude-code.explainSelection"
  }
]

3.12 安装检查清单

完成本章所有步骤后，逐项确认以下内容：

[ ] Node.js 版本 >= 22.x，Git 版本 >= 2.23
[ ] VSCode 扩展 anthropic.claude-code 已安装并可看到侧边栏面板
[ ] cc-switch 已安装并可切换模型
[ ] DeepSeek API Key 已获取并在 cc-switch 或 settings.json 中配置
[ ] 模型映射已正确配置（Haiku → V4 Flash, Sonnet → V4 Flash/Pro, Opus → V4 Pro）
[ ] 第一个对话已成功运行，Claude Code 能正常回复
[ ] ~/.claude/settings.json 存在且配置正确
[ ] 个人推荐设置已添加（可选但推荐）
[ ] 项目根目录有 CLAUDE.md（可选，但强烈推荐，见第 12 章）
[ ] 理解侧边栏面板的三个区域（对话区 / Diff 审查区 / 终端输出区）

下一步： 第 4 章将带你概览 Claude Code 的平台生态——五种使用方式（CLI / VSCode / JetBrains / Web / Desktop）的对比，以及为什么本书选择以 VSCode 扩展为主线。

第 3 章：环境搭建 ​

3.1 前置依赖 ​

3.2 安装 Claude Code for VSCode ​

安装扩展 ​

初始设置 ​

3.3 安装 cc-switch ​

下载与安装 ​

3.4 配置 DeepSeek API 接入 ​

DeepSeek V4 系列 ​

定价对比 ​

模型选择建议 ​

获取 API Key ​

GUI 配置步骤 ​

3.5 配置 Anthropic 官方 API（双账号策略） ​

在 cc-switch 中同时配置两家 ​

典型使用模式 ​

3.6 手动配置方式（可选） ​

DeepSeek 配置示例 ​

关键环境变量说明 ​

切换到 Anthropic 官方 ​

3.7 第一个对话 ​

3.8 VSCode 界面导览 ​

侧边栏面板 ​

三种启动方式 ​

右键菜单功能 ​

3.9 个人推荐设置 ​

各设置详解 ​

3.10 配置体系概览 ​

各层简介 ​

3.11 环境变量参考 ​

VSCode 快捷键参考 ​

自定义快捷键 ​

3.12 安装检查清单 ​

第 3 章：环境搭建

3.1 前置依赖

3.2 安装 Claude Code for VSCode

安装扩展

初始设置

3.3 安装 cc-switch

下载与安装

3.4 配置 DeepSeek API 接入

DeepSeek V4 系列

定价对比

模型选择建议

获取 API Key

GUI 配置步骤

3.5 配置 Anthropic 官方 API（双账号策略）

在 cc-switch 中同时配置两家

典型使用模式

3.6 手动配置方式（可选）

DeepSeek 配置示例

关键环境变量说明

切换到 Anthropic 官方

3.7 第一个对话

3.8 VSCode 界面导览

侧边栏面板

三种启动方式

右键菜单功能

3.9 个人推荐设置

各设置详解

3.10 配置体系概览

各层简介

3.11 环境变量参考

VSCode 快捷键参考

自定义快捷键

3.12 安装检查清单