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

在 VS Code 里装上 Claude CodeCodex

全程在 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 CodeCodex 就排在最前面两行。
推荐商店根据你当前打开的项目猜你可能要用的,右侧按钮是蓝色的 「安装」
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 CODECODEX。加上原本就有的 「聊天」,一共三个,点哪个用哪个,当前选中的那个底下带一条下划线:

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

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

  • Ctrl + Shift + P(macOS 是 + Shift + P)打开命令面板,输入面板名称(Claude CodeCodex),挑带 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 群里问,或者直接找站长。

打开