VS Code 插件安装教程
两个官方 agent 插件 · 一个面板切换

在 VS Code 里装上 Claude Code 与 Codex

全程在 VS Code 内部完成,不用开网页版扩展商店。搜名字、认发布者、点安装,装完右侧面板顶部就多出两个页签,写下第一条任务立刻开跑。

VS Code 扩展商店 6 步走完 约 5 分钟 Anthropic + OpenAI 官方
00

开始之前

两个插件,一个面板,互不打架

  • 一台装好 VS Code 的电脑。打开的是本地文件夹,还是已经通过 Remote-SSH 连上的远程服务器,两种都行。
  • 网络能正常打开 VS Code 的扩展商店——面板里搜得出东西就算通。
  • 预留 5 分钟,全程点鼠标,不用敲一条命令。
先认识两位主角Claude Code for VS Code 是 Anthropic 官方出的插件,把 Claude Code 的 agent 能力整个搬进编辑器侧边栏;Codex 是 OpenAI 官方的同类编程 agent。两个可以同时装,装完在同一个面板里用页签切换,各跑各的,互不冲突。
插件免费,模型额度另算从扩展商店装插件这一步不花一分钱,真正消耗的是背后的模型额度。所以装完之后还差一步:登录官方账号,或者填一个 API Key。这部分见 常见问题 里的对应条目。
01

打开扩展面板

左侧四个方块,或者一个快捷键

打开 VS Code,点左侧活动栏里那个四个方块的图标;懒得找就直接按 Ctrl + Shift + X(macOS 是 ⌘ + Shift + X)。面板从左边滑出来,最上面那条就是搜索框,写着 「在应用商店中搜索扩展」:

扩展面板全景 VS Code 左侧扩展面板全景,顶部是搜索框,下方依次是已安装、推荐、MCP 服务器三个分组
扩展面板 · 顶部搜索框,往下依次是「已安装」「推荐」「MCP 服务器」
分组里面是什么
已安装这台机器上已经装好的扩展,图里是 19 个。Claude Code for VS Code 和 Codex 就排在最前面两行。
推荐商店根据你当前打开的项目猜你可能要用的,右侧按钮是蓝色的 「安装」。
MCP 服务器新版 VS Code 才有的分组,和本教程没关系,先不用管。

左侧活动栏的扩展图标上如果带一个数字角标(图里是 2),说明有这么多扩展可以更新,和安装无关。

你打开时长得不一样,别慌上面这张是已经装完的样子,所以两个插件躺在「已安装」里、按钮写着 「更新」。你第一次打开时它们还不在这个位置——要么在下面的「推荐」里,要么得自己搜出来,按钮是蓝色的 「安装」。
02

安装 Claude Code

认准发布者 Anthropic

在顶部搜索框输入 Claude Code,结果列表里找这一条:名称是 「Claude Code for VS Code」,下面一行的发布者写着 Anthropic,名字左边带一个蓝色认证勾。对准它点右侧蓝色的 「安装」:

官方的就这两条 扩展面板已安装分组顶部的两行:Anthropic 发布的 Claude Code for VS Code 与 OpenAI 发布的 Codex
上面一行是 Anthropic 的 Claude Code,下面一行是 OpenAI 的 Codex · 发布者名字前都有蓝色认证勾
搜索词Claude Code
插件名称Claude Code for VS Code
发布者Anthropic,名字前带蓝色认证勾
装好标志「安装」按钮变成齿轮图标,插件进入「已安装」分组
看发布者,别只看名字扩展商店里同名、近名的第三方插件不少,名字能起得一模一样,发布者仿不了。另外图里按钮显示的是 「更新」,那是因为这台机器早就装过了;你第一次装,同一个位置是蓝色的 「安装」。
03

安装 Codex

同一个搜索框,换个关键词

不用退出面板,把搜索框里的字清掉,重新输入 Codex。目标是上一张图里带黑色 OpenAI 图标的那一行——列表宽度不够,名字会被截断成 「Codex – OpenAI's codi…」,完整名称是 「Codex – OpenAI's coding agent」。同样点 「安装」:

搜索词Codex
插件名称Codex – OpenAI's coding agent(列表里显示不全)
发布者OpenAI,名字前带蓝色认证勾
图标黑底的 OpenAI 标志,在列表里很好认
  1. 清空搜索框,输入 Codex。
  2. 核对名称和发布者,确认是 OpenAI 那一条,别点成同名的第三方。
  3. 点 「安装」,等进度条走完。
  4. 按钮变成齿轮图标、或者出现 「禁用 / 卸载」,就说明装好了。

要不要重载窗口?一般不用,VS Code 会自己把插件挂上去。个别情况按钮位置会冒出 「Reload」/「重新加载窗口」,点一下即可;没冒出来就当没这回事。

连着远程服务器的,看这里如果你是通过 Remote-SSH 连着一台服务器写代码,这类 agent 插件必须装在远程那一侧,装在本地它读不到服务器上的文件。点进插件详情页,安装按钮会写成 「在 SSH: xxx 中安装」(xxx 是主机名占位符,你那儿显示的是真实主机名),点那个按钮,而不是普通的「安装」。
04

打开插件面板

右侧顶部多出两个页签

两个插件都装好后,VS Code 右侧面板顶部会多出两个页签:CLAUDE CODE 和 CODEX。加上原本就有的 「聊天」,一共三个,点哪个用哪个,当前选中的那个底下带一条下划线:

右侧面板顶部 VS Code 右侧面板顶部的三个页签:聊天、CLAUDE CODE、CODEX,其中 CODEX 带下划线处于选中状态
页签行 · 图里停在 CODEX,下划线表示当前选中;最右边两个按钮是全屏和关闭

右侧面板根本没出来?三个办法,从上往下试:

  • 按 Ctrl + Shift + P(macOS 是 ⌘ + Shift + P)打开命令面板,输入面板名称(Claude Code 或 Codex),挑带 Open / Focus 字样的那一条。
  • 去左侧活动栏找对应的插件图标,点一下也能把面板唤出来。
  • 还是没有,就在命令面板里跑一次 Developer: Reload Window 重载窗口。
看到这两个页签,安装就算完了不用登录、不用配置,页签只要在,说明插件本体已经挂到 VS Code 上了。点进去要是让你登录、或者提示没额度,那是下一件事,不是装错了——去 常见问题 对号入座。
05

看懂界面,发第一条任务

上中下三块,各管各的

5.1 面板就三块

点开 CODEX 页签,整个面板从上到下只有三块。Claude Code 页签的布局大同小异,看懂一个,另一个也会用:

Codex 面板全景 VS Code 右侧 Codex 面板全景:顶部页签、中间一次任务的完整运行记录、底部输入区
Codex 面板全景 · 中间那一大片是一次任务从分析到产出文件的完整记录
  • 顶部页签——在 聊天 / CLAUDE CODE / CODEX 之间切换;右上角两个按钮分别是全屏和关闭。
  • 中间对话区——你发的任务和它的执行过程都在这里。图里能看到它写的中文分析、一张结果表格,还有几张生成文件的卡片(.md 文件),每张卡片右边有 「打开」,点一下直接在编辑器里跳过去看。它动了哪些文件、生成了什么,这里全都列出来,不用自己去翻。
  • 底部输入区——写任务的地方,也是所有开关的所在地,下面单独讲。

5.2 底部输入区,一个个认

把最底下那两行放大看,从左到右就这些控件:

发任务前先扫一眼 Codex 面板底部输入区特写:加号、完全访问权限、custom、5.5 超高、IDE 上下文、圆形发送箭头,下一行是本地模式
输入区控件 · 重点是黄色那个权限模式和右边的模型强度
控件管什么
+加附件、引用文件,把某个具体文件直接塞给它看。
完全访问权限权限模式。它要改文件、跑命令的时候,是先问你一句还是直接动手。黄色这个是「不问,直接干」。
custom / IDE 上下文这次带进去的上下文范围——它能看到你哪些代码、当前编辑器里开着什么。
5.5 超高模型 + 推理强度,点开是下拉。放到 下一步 细讲。
圆形箭头发送。等同于在输入框里按 Enter。
本地模式任务在你这台机器上跑还是丢到云端跑。改本地代码就保持本地模式。

5.3 发第一条任务

  1. 先看权限模式。新手先切到需要批准的那种,别一上来就用「完全访问权限」。
  2. 在输入框里把要干的事写清楚——改哪个文件、想要什么结果,写得越具体返工越少。
  3. 扫一眼右边的模型和推理强度,确认不是你不想用的那个。
  4. 按 Enter,或者点右边那个圆形箭头发送,任务开始跑。
「完全访问权限」是把方向盘交出去这个模式下它不再问你,直接改文件、直接跑命令。第一次用请先切到需要批准的模式,每一步都过一遍眼,等你摸清它的脾气再放开。没做版本管理的目录尤其别开全权限。
06

切换模型与推理强度

按任务复杂度选,别一律拉满

点输入区底部那个 「5.5 超高」,会展开一个下拉。它其实是两样东西拼在一起显示的:左边 5.5 是模型,右边 「超高」 是推理强度,在下拉里分开选。

入口输入区右侧的 「5.5 超高」,点一下展开
模型5.5 / 5.2 等,具体有哪几个取决于你的账号或中转站分组
推理强度低 / 中 / 高 / 超高
  • 日常改代码、加个函数、调个样式 → 推理强度用中等,性价比最高,别拿它烧额度。
  • 复杂重构、跨文件改动、长链路 debug → 再往 高 或 超高 调。
  • 就是想省 → 换更低一档的模型,强度也压到 低。
  • 规律很简单:强度越高,跑得越慢、花得越多,但难题的一次成功率确实更高。

如果点开下拉发现模型很少、甚至是空的,那不是插件坏了——是 Key 或登录没生效,请求根本没走到你以为的那个后端。去 常见问题 对号入座。

常见问题

遇到问题先来这里对号入座

1搜出来一堆同名插件,怎么确认哪个是官方的
只看一件事:发布者。Claude Code 认 Anthropic,Codex 认 OpenAI,发布者名字前面都有蓝色认证勾。名字可以被人抄得一模一样,发布者抄不了。还不放心就点进详情页,看右侧的仓库链接和安装量对不对。装错了不要紧,在「已安装」里找到它点卸载就行。
2装完了,右侧面板没有 CLAUDE CODE / CODEX 页签
按顺序排查三件事:① 在命令面板(Ctrl + Shift + P)里跑 Developer: Reload Window 重载窗口;② 回扩展面板确认插件没有被禁用(按钮位置会写「启用」);③ 确认装的位置对——远程 SSH 场景下装在本地是不会出现页签的,见下一条。都排完还没有,参考 第 4 步 里从活动栏图标唤出面板的办法。
3我通过 SSH 连着远程服务器,插件该装在哪一边
装在远程那一侧。这类 agent 插件要读写你正在编辑的代码,装在本地它只能看到本地磁盘,看不到服务器上的文件。做法:连上远程后打开扩展面板搜插件,点进详情页,安装按钮会变成 「在 SSH: xxx 中安装」(xxx 是主机名占位符),点那个。已经装错在本地的,可以两边都留着,但用的时候一定要确认远程侧那份是启用的——扩展面板里会分「本地 - 已安装」和「SSH: xxx - 已安装」两栏,看清楚再操作。
4插件装好了,但一直让我登录 / 提示没有额度
这是正常的,插件只是个界面,它自己不带额度。两条路二选一:① 用官方订阅账号登录;② 填一个中转站的 API Key。走中转站这条路的话,怎么创建 Key、怎么选分组、怎么写进配置,另有一份单独的教程,找站长或群里要就行,本篇只管把插件装上。
5模型下拉是空的,或者少了我买的那几个模型
说明请求没走到你以为的那个后端。检查两件事:① 当前是不是真的用着你配的那个 Key / 那个登录态,而不是插件的默认账号;② Key 属于哪个分组——分组决定了你能看到哪些模型,买了 A 套餐却把 Key 建在 B 分组,付费模型就是不会出现。改完记得重开一次面板让它重新拉列表。
6两个插件同时装,会不会互相冲突
不会。它们各占一个页签、各自独立的会话和配置,互不干扰,这也是本教程让你两个都装的原因——哪个顺手用哪个。唯一要注意的是:两边同时挂着任务在跑,就会分别消耗各自的额度,不是共享的。不用的那个页签关掉就好,插件本身闲着不花钱。

插件装好了,去写第一条任务吧

还有问题解决不了?带上报错截图到 QQ 群里问,或者直接找站长。

打开