How to Integrate Claude Code into VS Code

Integrating Claude Code into VS Code means installing the Claude Code extension (or a compatible AI coding extension), connecting it to a valid API key, and configuring your workspace so Claude can read context, suggest edits, and run tool calls directly from the editor. The whole setup takes under ten minutes if you already have API access — most of the friction people hit is around key management and permissions, not the extension itself.

This guide walks through the setup end to end: installing the extension, generating and wiring up an API key, verifying the connection, and fixing the handful of issues that actually come up in practice.

What "Claude Code in VS Code" actually means

There are two separate things people mean when they search this:

1. The Claude Code CLI/extension — Anthropic's terminal-based coding agent, which also ships a VS Code extension that embeds the same agent loop inside your editor (sidebar chat, inline diffs, file edits, terminal command execution).
2. Claude models inside a general AI extension — tools like Continue, Cody, or custom chat panels that let you point at any Claude-compatible API endpoint and use Claude for completions, chat, and refactoring.

Both routes need the same thing under the hood: an API key that VS Code can send requests through. The rest of this guide covers both paths.

Step 1: Install the extension

Open the Extensions panel in VS Code (Cmd+Shift+X / Ctrl+Shift+X) and search for Claude Code. Install it, then reload the window when prompted. If you're using a general-purpose AI extension instead (Continue is the most common), install that and look for its "Anthropic" or "custom OpenAI-compatible" provider option in settings — most of these extensions support Claude either natively or via a custom base URL.

Step 2: Get an API key

You need a key that can call Claude's Messages API. There are three common sources:

• A direct Anthropic API key, if you or your team already has billing set up with Anthropic.
• A gateway key from a service like SubToAPI, which sits on top of your existing Claude access and issues application-scoped keys (sub_live_...) with usage tracking and team seats — useful if you want per-project keys without giving every developer raw account access.
• A shared organization key managed by whoever handles infra for your team.

If you're setting this up for a team and want visibility into who's calling what, signup for a SubToAPI account takes a few minutes and gives you a dashboard to issue separate keys per developer or per project, which is much easier to audit than one shared secret pasted into everyone's settings.json.

Step 3: Configure the extension

For the Claude Code extension, open VS Code settings (Cmd+, / Ctrl+,), search for "Claude Code," and paste your API key into the relevant field, or set it as an environment variable before launching VS Code:

export ANTHROPIC_API_KEY="sk-ant-..."
code .

If you're routing through a gateway instead of calling Anthropic directly, most extensions that support a custom base URL will let you override the endpoint in settings.json:

{
  "claudeCode.apiKey": "${env:SUBTOAPI_KEY}",
  "claudeCode.baseUrl": "https://api.subtoapi.app/v1"
}

Exact setting names vary by extension version — check the extension's settings schema (type "Claude" into the settings search box) to find the current field names for API key and base URL.

Step 4: Verify the connection

Before trusting the extension inside your editor, confirm the key works with a plain curl request. This isolates "is my key valid" from "is the extension configured correctly," which saves a lot of debugging time:

curl https://api.subtoapi.app/v1/messages \
  -H "Authorization: Bearer $SUBTOAPI_KEY" \
  -H "content-type: application/json" \
  -d '{
    "model": "claude-sonnet-4",
    "max_tokens": 100,
    "messages": [{"role": "user", "content": "Say hello in one sentence."}]
  }'

If that returns a valid response, open the extension in VS Code, start a new chat, and ask it something trivial about your open file. If it responds with relevant context, the wiring is correct. The docs/quickstart page has the same request format if you're setting this up against SubToAPI specifically.

Working with streaming and tool calls

Once basic chat works, most developers want two things from Claude inside VS Code: streamed responses (so output appears token by token instead of after a long pause) and tool use (so Claude can run terminal commands, read files, or call functions you've defined). The Claude Code extension handles both natively. If you're building your own integration on top of a general chat extension, check the docs/streaming and docs/tools references for request formats — streaming uses server-sent events, and tool calls follow the same schema as the standard Messages API.

Common setup problems

• "Invalid API key" on first request — usually a copy-paste issue with a trailing space, or the key was scoped to a different environment (test vs live). Regenerate a fresh key and re-paste it directly rather than retyping.
• Extension loads but never responds — check that your base URL setting doesn't have a trailing slash mismatch, and confirm outbound network access isn't blocked by a corporate proxy or firewall.
• Works in curl but not in the extension — almost always a settings.json scope issue; the key or URL is set in user settings but the workspace settings override it with something stale.
• Rate limit errors under team use — if multiple developers share one raw API key, you'll hit limits faster and can't tell whose usage caused it. Splitting keys per person, per project via a gateway like SubToAPI's pricing plans, fixes both the limits and the attribution problem.

Questions

Do I need the official Claude Code extension, or can I use Claude in any VS Code AI extension? You can use Claude in any extension that supports a custom Anthropic-compatible endpoint (Continue, Cody, and several others). The official Claude Code extension gives you the full agent loop with file edits and terminal access; general extensions typically give you chat and inline completions only.

Can I use one API key across my whole team in VS Code? Technically yes, but it makes usage attribution and rate limiting hard to manage. Issuing separate keys per developer through a dashboard, such as SubToAPI's team seats, keeps per-person usage visible without sharing one secret.

Why does my extension show a connection error even though my API key is valid? This is almost always a base URL or settings scope problem — the key is correct but the extension is pointed at the wrong endpoint, or a workspace-level setting is overriding your user-level configuration. Test the key directly with curl first to rule out the key itself.