> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aiohub.org/llms.txt
> Use this file to discover all available pages before exploring further.

# VS Code

> 在 VS Code 中通过 Claude Code 和 Codex 扩展接入 AIOHub。

VS Code 是最流行的代码编辑器之一。你可以通过安装 Claude Code 或 Codex 扩展，在编辑器内直接使用 AIOHub 提供的 AI 模型进行代码补全、对话和重构。

## 前置条件

* 已安装 [VS Code](https://code.visualstudio.com/)
* 已 [创建 AIOHub API 令牌](/cn/account/create-token)
* 账户有充足余额

## 扩展概览

两个扩展使用不同的协议和配置，互不冲突，可以同时安装并按需切换：

<Frame>
  <img src="https://mintcdn.com/qyhfrankgmailcom/SeCdv7bi4l2-dqqS/images/cn/clients/vscode/0_claude_and_codex_plugin.png?fit=max&auto=format&n=SeCdv7bi4l2-dqqS&q=85&s=5f5016c7380472df6f5f93f1445fbebf" alt="VS Code 扩展市场中的 Claude Code 和 Codex" width="400" height="197" data-path="images/cn/clients/vscode/0_claude_and_codex_plugin.png" />
</Frame>

| 扩展          | 协议               | Base URL                    |
| ----------- | ---------------- | --------------------------- |
| Claude Code | Claude Messages  | `https://api.aiohub.org`    |
| Codex       | OpenAI Responses | `https://api.aiohub.org/v1` |

<Warning>两个扩展的 API 令牌需要关联正确的分组，否则会出现模型不可用或鉴权失败。创建令牌时请注意选择对应分组。</Warning>

***

## Claude Code 扩展

[Claude Code](https://marketplace.visualstudio.com/items?itemName=anthropics.claude-code) 是 Anthropic 官方的 VS Code 扩展，提供 AI 对话、代码编辑和终端操作能力。

<Steps>
  <Step title="安装扩展">
    在 VS Code 扩展市场搜索 **Claude Code** 并安装，或在终端执行：

    ```bash theme={"system"}
    code --install-extension anthropics.claude-code
    ```
  </Step>

  <Step title="配置环境变量">
    Claude Code 扩展复用 Claude Code CLI 的环境变量。将以下内容添加到 `~/.zshrc` 或 `~/.bashrc`：

    ```bash theme={"system"}
    export ANTHROPIC_BASE_URL="https://api.aiohub.org"
    export ANTHROPIC_AUTH_TOKEN="sk-你的API令牌"
    ```

    <Frame>
      <img src="https://mintcdn.com/qyhfrankgmailcom/SeCdv7bi4l2-dqqS/images/cn/clients/vscode/1_claude_auth_token.png?fit=max&auto=format&n=SeCdv7bi4l2-dqqS&q=85&s=7326ecd97342c2fad03d075c18d0a431" alt="配置 Claude Code 环境变量" width="820" height="135" data-path="images/cn/clients/vscode/1_claude_auth_token.png" />
    </Frame>

    保存后执行 `source ~/.bashrc`（或 `source ~/.zshrc`），然后重启 VS Code。

    <Warning>`ANTHROPIC_BASE_URL` 不要加 `/v1`。Claude Code 会自行追加 `/v1/messages`。</Warning>

    Windows 用户可在系统环境变量中添加：

    | 变量名                    | 值                        |
    | ---------------------- | ------------------------ |
    | `ANTHROPIC_BASE_URL`   | `https://api.aiohub.org` |
    | `ANTHROPIC_AUTH_TOKEN` | `sk-你的API令牌`             |

    也可以在 VS Code 的 `settings.json` 中配置终端环境变量：

    ```json theme={"system"}
    {
      "terminal.integrated.env.osx": {
        "ANTHROPIC_BASE_URL": "https://api.aiohub.org",
        "ANTHROPIC_AUTH_TOKEN": "sk-你的API令牌"
      },
      "terminal.integrated.env.linux": {
        "ANTHROPIC_BASE_URL": "https://api.aiohub.org",
        "ANTHROPIC_AUTH_TOKEN": "sk-你的API令牌"
      },
      "terminal.integrated.env.windows": {
        "ANTHROPIC_BASE_URL": "https://api.aiohub.org",
        "ANTHROPIC_AUTH_TOKEN": "sk-你的API令牌"
      }
    }
    ```
  </Step>

  <Step title="选择分组">
    API 令牌的分组决定了可用模型和价格。Claude Code 推荐以下分组：

    | 分组               | 特点                          |
    | ---------------- | --------------------------- |
    | `claude-bedrock` | 稳定可靠，支持 prompt caching，价格较高 |
    | `claude-kiro`    | 价格较低，偶尔中断，不支持 cache         |
    | `anthropic`      | 标准 Anthropic 路由             |

    详见 [令牌分组说明](/cn/account/groups)。
  </Step>

  <Step title="验证连接">
    打开 VS Code，在 Claude Code 面板中发送一条消息。正常回复即表示配置成功：

    <Frame>
      <img src="https://mintcdn.com/qyhfrankgmailcom/SeCdv7bi4l2-dqqS/images/cn/clients/vscode/2_claude_screenshot.png?fit=max&auto=format&n=SeCdv7bi4l2-dqqS&q=85&s=fc036903f0b9ca53954567003dfc7285" alt="Claude Code 对话成功" width="692" height="681" data-path="images/cn/clients/vscode/2_claude_screenshot.png" />
    </Frame>
  </Step>
</Steps>

***

## Codex 扩展

[Codex](https://marketplace.visualstudio.com/items?itemName=openai.codex) 是 OpenAI 官方的 VS Code 扩展，提供 AI 编程助手能力。

<Steps>
  <Step title="安装扩展">
    在 VS Code 扩展市场搜索 **Codex** 并安装，或在终端执行：

    ```bash theme={"system"}
    code --install-extension openai.codex
    ```
  </Step>

  <Step title="创建配置文件">
    Codex 扩展复用 Codex CLI 的配置文件。如果你已经按照 [Codex CLI 配置](/cn/clients/codex) 完成了设置，VS Code 扩展会自动读取，可以跳过这一步。

    如果还没有配置，创建 `~/.codex/config.toml`：

    ```toml theme={"system"}
    model_provider = "aiohub"
    model = "gpt-5.3-codex"

    [model_providers.aiohub]
    name = "AIOHub"
    base_url = "https://api.aiohub.org/v1"
    env_key = "AIOHUB_API_KEY"
    wire_api = "responses"
    requires_openai_auth = false
    supports_websockets = false
    ```

    <Frame>
      <img src="https://mintcdn.com/qyhfrankgmailcom/SeCdv7bi4l2-dqqS/images/cn/clients/vscode/3_codex_config.png?fit=max&auto=format&n=SeCdv7bi4l2-dqqS&q=85&s=c911a3c3d6fc6c0f31712001ba4dcd38" alt="Codex 配置文件" width="744" height="453" data-path="images/cn/clients/vscode/3_codex_config.png" />
    </Frame>
  </Step>

  <Step title="配置环境变量">
    在 `~/.bashrc` 或 `~/.zshrc` 中设置 API 令牌：

    ```bash theme={"system"}
    export AIOHUB_API_KEY="sk-你的API令牌"
    ```

    <Frame>
      <img src="https://mintcdn.com/qyhfrankgmailcom/SeCdv7bi4l2-dqqS/images/cn/clients/vscode/4_codex_key.png?fit=max&auto=format&n=SeCdv7bi4l2-dqqS&q=85&s=de11bb677c8638ba632d22c5fbc25461" alt="配置 Codex 环境变量" width="802" height="72" data-path="images/cn/clients/vscode/4_codex_key.png" />
    </Frame>

    <Note>`base_url` 需要包含 `/v1`。Codex 使用 OpenAI Responses API，与 Claude Code 的地址不同。</Note>
  </Step>

  <Step title="选择分组">
    API 令牌的分组决定了可用模型和价格。Codex 推荐以下分组：

    | 分组                  | 特点                |
    | ------------------- | ----------------- |
    | `codex`             | 网关中转，兼容性优先        |
    | `codex-passthrough` | 直通低延迟，仅限 CLI/扩展场景 |

    详见 [令牌分组说明](/cn/account/groups)。
  </Step>

  <Step title="验证连接">
    保存配置后重启 VS Code，在 Codex 面板中发送一条消息。正常回复即表示配置成功：

    <Frame>
      <img src="https://mintcdn.com/qyhfrankgmailcom/SeCdv7bi4l2-dqqS/images/cn/clients/vscode/5_codex_screenshot.png?fit=max&auto=format&n=SeCdv7bi4l2-dqqS&q=85&s=d7bb1ba1ef604c33a05ec049ee0697df" alt="Codex 对话成功" width="668" height="660" data-path="images/cn/clients/vscode/5_codex_screenshot.png" />
    </Frame>
  </Step>
</Steps>

***

## 常见问题

<AccordionGroup>
  <Accordion title="扩展安装后没有反应">
    确认 VS Code 版本 ≥ 1.90。部分扩展需要较新版本的 VS Code 才能正常运行。重启 VS Code 后再试。
  </Accordion>

  <Accordion title="Claude Code 扩展提示登录">
    确认环境变量 `ANTHROPIC_AUTH_TOKEN` 已正确设置并且 VS Code 能读取到。可以在 VS Code 内置终端中执行 `echo $ANTHROPIC_AUTH_TOKEN` 验证。
  </Accordion>

  <Accordion title="Codex 扩展连接失败">
    检查 `~/.codex/config.toml` 中 `base_url` 是否为 `https://api.aiohub.org/v1`，以及 `AIOHUB_API_KEY` 环境变量是否存在。
  </Accordion>

  <Accordion title="两个扩展可以同时使用吗？">
    可以。Claude Code 和 Codex 使用不同的协议和配置，互不冲突。你可以同时安装并按需切换使用。
  </Accordion>

  <Accordion title="余额不足">
    前往 [钱包管理](https://api.aiohub.org/console/topup) 查看余额。详见 [充值说明](/cn/account/recharge)。
  </Accordion>
</AccordionGroup>

## 其他编辑器扩展

如果你使用的编辑器扩展支持自定义 OpenAI Base URL（如 Continue、Cline 等），请参考 [OpenAI 兼容应用](/cn/clients/api-compatible) 页面进行配置。