Last updated: 2026-04-12

VS Code Setup

Set up Visual Studio Code for developing with SpendLil.

This guide covers setting up VS Code to route AI API calls through SpendLil during development — environment configuration, testing requests, debugging, and code snippets.

Environment Setup

bash .env
# SpendLil
SPENDLIL_KEY=sl_abc123def456

# Provider keys (passed through SpendLil via X-Provider-Key, never stored)
OPENAI_API_KEY=sk-...
ANTHROPIC_API_KEY=sk-ant-...
GOOGLE_API_KEY=AIza...
bash .env.example (commit this)
# SpendLil — get your key at https://app.spendlil.ai
SPENDLIL_KEY=sl_your_key_here

# Provider API keys (routed through SpendLil)
OPENAI_API_KEY=sk-...
ANTHROPIC_API_KEY=sk-ant-...
GOOGLE_API_KEY=AIza...

Recommended Extensions

ExtensionPurpose
REST Client (humao.rest-client)Send HTTP requests directly from VS Code — test SpendLil proxy calls without leaving the editor
Thunder ClientAlternative GUI-based HTTP client with collection support
DotENV (mikestead.dotenv)Syntax highlighting for .env files

REST Client Examples

Install the REST Client extension and create a .http file in your project. This gives you one-click API testing routed through SpendLil.

text spendlil.http
@spendlilKey = {{$dotenv SPENDLIL_KEY}}
@openaiKey = {{$dotenv OPENAI_API_KEY}}
@anthropicKey = {{$dotenv ANTHROPIC_API_KEY}}

### OpenAI — Chat Completion (via SpendLil)
POST https://openai.gateway.spendlil.ai/v1/chat/completions
X-SpendLil-Key: {{spendlilKey}}
X-Provider-Key: Bearer {{openaiKey}}
Content-Type: application/json

{
  "model": "gpt-4o-mini",
  "messages": [
    {"role": "user", "content": "Hello from VS Code"}
  ]
}

### Anthropic — Messages (via SpendLil)
POST https://anthropic.gateway.spendlil.ai/v1/messages
X-SpendLil-Key: {{spendlilKey}}
X-Provider-Key: Bearer {{anthropicKey}}
Content-Type: application/json
anthropic-version: 2023-06-01

{
  "model": "claude-sonnet-4-5",
  "max_tokens": 256,
  "messages": [
    {"role": "user", "content": "Hello from VS Code"}
  ]
}

### Google Gemini (via SpendLil)
POST https://google.gateway.spendlil.ai/v1beta/models/gemini-2.0-flash:generateContent
X-SpendLil-Key: {{spendlilKey}}
X-Provider-Key: Bearer {{$dotenv GOOGLE_API_KEY}}
Content-Type: application/json

{
  "contents": [{"parts": [{"text": "Hello from VS Code"}]}]
}

### SpendLil Health Check (OpenAI gateway)
GET https://openai.gateway.spendlil.ai/health

### SpendLil Dashboard — Get Summary
GET https://api.spendlil.ai/api/dashboard/summary
Authorization: Bearer {{$dotenv SPENDLIL_JWT}}
💡 Click 'Send Request' above any ### block

The REST Client extension renders clickable links inline. Hit Send Request and the response appears in a split panel. Check the X-SpendLil-Route header to confirm tracking.

Launch Configuration

json .vscode/launch.json
{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Node.js (with SpendLil)",
      "type": "node",
      "request": "launch",
      "program": "${workspaceFolder}/src/index.ts",
      "envFile": "${workspaceFolder}/.env",
      "console": "integratedTerminal"
    },
    {
      "name": "Python (with SpendLil)",
      "type": "debugpy",
      "request": "launch",
      "program": "${workspaceFolder}/main.py",
      "envFile": "${workspaceFolder}/.env",
      "console": "integratedTerminal"
    }
  ]
}

Snippets

json .vscode/spendlil.code-snippets
{
  "SpendLil OpenAI Call (Node.js)": {
    "scope": "javascript,typescript",
    "prefix": "spendlil-openai",
    "body": [
      "const response = await fetch(",
      "  'https://openai.gateway.spendlil.ai/v1/chat/completions',",
      "  {",
      "    method: 'POST',",
      "    headers: {",
      "      'X-SpendLil-Key': process.env.SPENDLIL_KEY,",
      "      'X-Provider-Key': \`Bearer \${process.env.OPENAI_API_KEY}\`,",
      "      'Content-Type': 'application/json',",
      "    },",
      "    body: JSON.stringify({",
      "      model: '${1:gpt-4o-mini}',",
      "      messages: [{ role: 'user', content: '${2:Hello}' }],",
      "    }),",
      "  }",
      ");",
      "const data = await response.json();"
    ],
    "description": "OpenAI call routed through SpendLil"
  },
  "SpendLil Anthropic Call (Node.js)": {
    "scope": "javascript,typescript",
    "prefix": "spendlil-anthropic",
    "body": [
      "const response = await fetch(",
      "  'https://anthropic.gateway.spendlil.ai/v1/messages',",
      "  {",
      "    method: 'POST',",
      "    headers: {",
      "      'X-SpendLil-Key': process.env.SPENDLIL_KEY,",
      "      'X-Provider-Key': \`Bearer \${process.env.ANTHROPIC_API_KEY}\`,",
      "      'Content-Type': 'application/json',",
      "      'anthropic-version': '2023-06-01',",
      "    },",
      "    body: JSON.stringify({",
      "      model: '${1:claude-sonnet-4-5-20250514}',",
      "      max_tokens: ${2:1024},",
      "      messages: [{ role: 'user', content: '${3:Hello}' }],",
      "    }),",
      "  }",
      ");",
      "const data = await response.json();"
    ],
    "description": "Anthropic call routed through SpendLil"
  }
}