> ## 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

> Connect AIOHub to VS Code through the Claude Code and Codex extensions.

VS Code is one of the most popular code editors. You can install the Claude Code or Codex extension to use AIOHub AI models directly in the editor for code completion, chat, and refactoring.

## Prerequisites

* [VS Code](https://code.visualstudio.com/) installed
* An [AIOHub API key](/en/account/create-token)
* Sufficient account balance

## Extension overview

The two extensions use different protocols and configurations. They do not conflict and can be installed side by side:

<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="Claude Code and Codex in the VS Code extension marketplace" width="400" height="197" data-path="images/cn/clients/vscode/0_claude_and_codex_plugin.png" />
</Frame>

| Extension   | Protocol         | Base URL                    |
| ----------- | ---------------- | --------------------------- |
| Claude Code | Claude Messages  | `https://api.aiohub.org`    |
| Codex       | OpenAI Responses | `https://api.aiohub.org/v1` |

<Warning>Your API key must be associated with the correct group, otherwise models will be unavailable or authentication will fail. Choose the appropriate group when creating your key.</Warning>

***

## Claude Code extension

[Claude Code](https://marketplace.visualstudio.com/items?itemName=anthropics.claude-code) is Anthropic's official VS Code extension, providing AI chat, code editing, and terminal capabilities.

<Steps>
  <Step title="Install the extension">
    Search for **Claude Code** in the VS Code extension marketplace, or run:

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

  <Step title="Configure environment variables">
    The Claude Code extension uses the same environment variables as the Claude Code CLI. Add to `~/.zshrc` or `~/.bashrc`:

    ```bash theme={"system"}
    export ANTHROPIC_BASE_URL="https://api.aiohub.org"
    export ANTHROPIC_AUTH_TOKEN="sk-your-api-key"
    ```

    <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="Configuring Claude Code environment variables" width="820" height="135" data-path="images/cn/clients/vscode/1_claude_auth_token.png" />
    </Frame>

    Run `source ~/.bashrc` (or `source ~/.zshrc`), then restart VS Code.

    <Warning>`ANTHROPIC_BASE_URL` must not include `/v1`. Claude Code appends `/v1/messages` automatically.</Warning>

    On Windows, add system environment variables:

    | Variable               | Value                    |
    | ---------------------- | ------------------------ |
    | `ANTHROPIC_BASE_URL`   | `https://api.aiohub.org` |
    | `ANTHROPIC_AUTH_TOKEN` | `sk-your-api-key`        |

    You can also set terminal environment variables in VS Code `settings.json`:

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

  <Step title="Choose a group">
    Your API key's group determines which models are available and at what price. Recommended groups for Claude Code:

    | Group            | Notes                                              |
    | ---------------- | -------------------------------------------------- |
    | `claude-bedrock` | Stable, supports prompt caching, higher price      |
    | `claude-kiro`    | Lower price, occasional downtime, no cache support |
    | `anthropic`      | Standard Anthropic route                           |

    See [Groups](/en/account/groups) for details.
  </Step>

  <Step title="Verify the connection">
    Open VS Code and send a message in the Claude Code panel. A normal response confirms the setup works:

    <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 chat working" width="692" height="681" data-path="images/cn/clients/vscode/2_claude_screenshot.png" />
    </Frame>
  </Step>
</Steps>

***

## Codex extension

[Codex](https://marketplace.visualstudio.com/items?itemName=openai.codex) is OpenAI's official VS Code extension for AI-assisted programming.

<Steps>
  <Step title="Install the extension">
    Search for **Codex** in the VS Code extension marketplace, or run:

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

  <Step title="Create the config file">
    The Codex extension reads from the same `~/.codex/config.toml` as the CLI. If you already followed the [Codex CLI setup](/en/clients/codex), the extension picks it up automatically and you can skip this step.

    If not yet configured, create `~/.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 config file" width="744" height="453" data-path="images/cn/clients/vscode/3_codex_config.png" />
    </Frame>
  </Step>

  <Step title="Set the environment variable">
    Add the API key to `~/.bashrc` or `~/.zshrc`:

    ```bash theme={"system"}
    export AIOHUB_API_KEY="sk-your-api-key"
    ```

    <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="Configuring Codex environment variable" width="802" height="72" data-path="images/cn/clients/vscode/4_codex_key.png" />
    </Frame>

    <Note>`base_url` must include `/v1`. Codex uses the OpenAI Responses API, which differs from Claude Code's endpoint.</Note>
  </Step>

  <Step title="Choose a group">
    Your API key's group determines which models are available and at what price. Recommended groups for Codex:

    | Group               | Notes                              |
    | ------------------- | ---------------------------------- |
    | `codex`             | Gateway relay, compatibility-first |
    | `codex-passthrough` | Direct pass-through, low latency   |

    See [Groups](/en/account/groups) for details.
  </Step>

  <Step title="Verify the connection">
    Restart VS Code and send a message in the Codex panel. A normal response confirms the setup works:

    <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 chat working" width="668" height="660" data-path="images/cn/clients/vscode/5_codex_screenshot.png" />
    </Frame>
  </Step>
</Steps>

***

## FAQ

<AccordionGroup>
  <Accordion title="Extension does nothing after install">
    Confirm VS Code version ≥ 1.90. Some extensions require a recent VS Code version. Restart VS Code and try again.
  </Accordion>

  <Accordion title="Claude Code extension asks to log in">
    Confirm `ANTHROPIC_AUTH_TOKEN` is set and VS Code can read it. Run `echo $ANTHROPIC_AUTH_TOKEN` in the VS Code integrated terminal to verify.
  </Accordion>

  <Accordion title="Codex extension connection fails">
    Check that `base_url` in `~/.codex/config.toml` is `https://api.aiohub.org/v1` and the `AIOHUB_API_KEY` environment variable exists.
  </Accordion>

  <Accordion title="Can I use both extensions at the same time?">
    Yes. Claude Code and Codex use different protocols and configurations. They do not conflict and you can switch between them as needed.
  </Accordion>

  <Accordion title="Insufficient balance">
    Check your balance at [wallet management](https://api.aiohub.org/console/topup). See [Add funds](/en/account/recharge).
  </Accordion>
</AccordionGroup>

## Other editor extensions

If your editor extension supports a custom OpenAI Base URL (e.g., Continue, Cline), see [OpenAI-compatible apps](/en/clients/api-compatible).