Claude Code × VSCode

TL;DR:手把手带你从零安装 Claude Code,并在 VSCode 里解锁最强 AI 编程体验。


前言

Claude Code 是 Anthropic 推出的 CLI 工具,它不只是代码补全——它能读懂整个项目上下文、自主修改文件、执行命令、跑测试,像一个真正的结对编程伙伴坐在你的终端里。

配合 VSCode 扩展,你会得到一个无缝嵌入编辑器的 AI Agent。


环境准备

前置依赖

工具 最低版本 说明
Node.js >= 18.x 运行时环境
npm >= 9.x 随 Node.js 附带
VSCode >= 1.90 编辑器本体

检查当前环境:

node -v
npm -v

安装 Claude Code

全局安装 CLI

npm(通用,所有平台):

npm install -g @anthropic-ai/claude-code

WinGet(Windows,我使用的):

winget install Anthropic.ClaudeCode

Homebrew(macOS / Linux):

brew install claude

macOS / Linux / WSL:

curl -fsSL https://claude.ai/install.sh | bash

Windows PowerShell:

irm https://claude.ai/install.ps1 | iex

Windows CMD:

curl -fsSL https://claude.ai/install.cmd -o install.cmd && install.cmd && del install.cmd

安装完成后验证:

claude --version


🚨 国内用户必读:代理配置

问题根源:Anthropic 屏蔽了来自中国 IP 的 API 访问,影响所有环节——OAuth 登录、API 调用、CLI 和 VSCode 扩展。即使拥有付费的 Claude Max 订阅,从中国 IP 发出的请求一律返回 403。必须先配置代理,再启动 Claude Code。

常见报错

OAuth error: Failed to fetch user roles: Request failed with status code 403
Unable to connect to Anthropic services
Failed to connect to api.anthropic.com: ERR_BAD_REQUEST
Note: Claude Code might not be available in your country.

以 v2rayN 为例(设置里查看端口,默认本地代理端口 10808,clash默认端口改为7890),需将 HTTPS_PROXY 环境变量指向本地代理。

临时设置(仅当前窗口有效)

CMD:

set HTTPS_PROXY=http://127.0.0.1:10808

PowerShell:

$env:HTTPS_PROXY = "http://127.0.0.1:10808"

设置后在同一窗口直接运行 claude 即可。

永久设置(推荐,重启后仍有效)

方式一:图形界面(新手推荐)

  1. Win + I → 搜索「高级系统设置」→ 点击「环境变量」
  2. 在「用户变量」区域点击「新建」
  3. 变量名:HTTPS_PROXY,变量值:http://127.0.0.1:10808
  4. 确定保存,重新打开命令行窗口生效

方式二:命令行一键设置

[Environment]::SetEnvironmentVariable("HTTPS_PROXY", "http://127.0.0.1:10808", [EnvironmentVariableTarget]::User)

执行后重新打开命令行窗口即可,无需重启电脑。

验证是否生效

:: CMD
echo %HTTPS_PROXY%
# PowerShell
echo $env:HTTPS_PROXY

输出 http://127.0.0.1:10808 即为设置成功,之后再启动 Claude Code。


启动 Claude Code

进入你的项目目录,直接启动:

cd your-project
claude

弹出以下提示,选择 1 即可继续:

Accessing workspace: C:\Users\...
Quick safety check: Is this a project you created or one you trust?
❯ 1. Yes, I trust this folder
  2. No, exit
Enter to confirm · Esc to cancel

若遇到连接报错。

Unable to connect to Anthropic services  
Failed to connect to api.anthropic.com: ERR_BAD_REQUEST  
Please check your internet connection and network settings.  
Note: Claude Code might not be available in your country. Check supported countries at https://anthropic.com/supported-countries

Windows下操作:

按下键盘 Win + R 键,输入 cmd 后回车,打开命令行程序
在命令行中运行以下命令后回车

powershell -Command "f='%USERPROFILE%\.claude.json';j=Get-Content f|ConvertFrom-Json;j|Add-Member -NotePropertyName 'hasCompletedOnboarding' -NotePropertyValue true -Force;j|ConvertTo-Json|Set-Content $f"

重启你的Claude Cli

首次启动会有简短的引导流程,授权完成后即可使用。


VSCode 扩展安装与配置

安装扩展

打开 VSCode,按 Ctrl+Shift+X 打开扩展市场,搜索:

Claude Code

找到 Anthropic 官方发布的扩展,点击 Install。

或者直接通过命令行安装:

code --install-extension anthropic.claude-code

扩展功能一览

安装完成后,你将解锁以下能力:

  • 内嵌聊天面板 — 不离开编辑器,直接和 Claude 对话
  • 选中代码提问 — 高亮代码后右键,发送给 Claude 分析
  • 差异视图 — Claude 的修改建议以 diff 形式展示,一键接受或拒绝
  • 终端集成 — Claude 可直接在 VSCode 内置终端执行命令

核心用法速查

基础对话

# 启动交互式会话
claude

# 单次提问(非交互模式)
claude -p "解释一下这个项目的架构"

常用快捷指令

在 Claude Code 会话中,输入 / 触发命令列表:

命令 功能
/help 查看帮助
/clear 清空上下文
/compact 压缩对话历史,节省 token
/model 切换模型
/cost 查看本次会话消耗
/review-pr PR 代码审查
/init 初始化项目,生成 CLAUDE.md

让 Claude 读懂你的项目

在项目根目录启动 Claude,进入交互式会话后执行:

/init

这会生成一个 CLAUDE.md,你可以在里面写:

  • 项目架构说明
  • 技术栈约定
  • 代码风格要求
  • 不希望 Claude 修改的文件

Claude 每次启动都会自动读取这个文件。


VSCode 进阶配置

settings.json 推荐配置

打开 Ctrl+Shift+POpen User Settings (JSON),添加:

{
  "terminal.integrated.defaultProfile.windows": "Git Bash"
}

其他 Claude Code 相关选项可在 VSCode 设置页(Ctrl+,)搜索 claude-code 查看完整列表,按需开启。

自定义键位绑定

打开 Ctrl+Shift+POpen Keyboard Shortcuts (JSON)

[
  {
    "key": "ctrl+shift+a",
    "command": "claude-code.openChat"
  },
  {
    "key": "ctrl+shift+r",
    "command": "claude-code.reviewSelection"
  }
]

权限模式说明

Claude Code 在执行文件读写、命令时会请求权限,分三种模式:

模式 行为
默认 每次操作都询问你
--dangerously-skip-permissions 全自动,不询问(仅限受信任环境)
--allowedTools 精确指定允许的工具范围,例如 --allowedTools Bash,Edit
--print / -p 非交互模式,单次执行后退出,适合脚本集成

Hooks 机制(进阶)

Claude Code 支持配置 Hooks,在特定事件触发时执行自定义脚本。

编辑 ~/.claude/settings.json

{
  "hooks": {
    "PreToolUse": [
      {
        "matcher": "Bash",
        "hooks": [
          {
            "type": "command",
            "command": "echo '[HOOK] 即将执行 Bash 命令'"
          }
        ]
      }
    ]
  }
}

可以用来:审计命令执行、拦截危险操作、记录日志。


常见问题排查

Q:claude: command not found

# 检查 npm 全局安装路径是否在 PATH 中
npm config get prefix
# 将 {prefix}/bin 加入 PATH

Q:403 / 无法连接 Anthropic 服务(国内常见)

先配置代理,参考上方「国内用户必读」章节。代理配置完成后,在同一终端窗口再次执行 claude

Q:VSCode 扩展无法连接

代理环境变量必须在启动 VSCode 的终端中生效,或永久写入系统环境变量,VSCode 扩展才能继承代理设置。确认终端中 claude 命令可以正常执行后,重启 VSCode。

小技巧 & 最佳实践

  • CLAUDE.md 约束行为:写明”不要修改 config/ 目录下的文件”之类的规则,Claude 会遵守。
  • 善用 /compact:长对话会消耗大量 token,及时压缩可以降低成本。
  • 选中代码再提问:在 VSCode 里高亮代码后打开 Claude 面板,上下文更精准。
  • 让 Claude 写测试:直接说”给这个函数写单元测试”,效果出奇得好。
  • 多模型切换:复杂推理用 Opus,日常编码用 Sonnet,速度与效果自由切换。

总结

安装 CLI → 装 VSCode 扩展 → 初始化 CLAUDE.md → 开始 vibe coding

Claude Code 最大的价值不是补全代码,而是理解项目、自主行动。把它当作一个真正的协作者,而不是一个更聪明的 Tab 键。


本文基于 Claude Code 最新版本(2026年3月)编写,部分功能随版本更新可能有所变化。