Cline

Connect Cline's autonomous VS Code agent to BitRouter for enhanced routing

Cline Integration

Quick Start

# 1. Start BitRouter
bitrouter serve

# 2. Configure VS Code settings
# Set "cline.customApiEndpoint": "http://localhost:8787"

# 3. Launch Cline in VS Code
# Open Command Palette: "Cline: Start New Session"

What You Get

  • 30+ LLM providers - All through BitRouter's unified interface
  • Human-in-the-loop safety - Maintain approval workflows
  • Enhanced MCP marketplace - Via BitRouter's MCP gateway
  • Cost tracking - Monitor spending across VS Code sessions
  • Transparent workflow - Full audit trail with BitRouter logging

Installation

Prerequisites

# Install Cline extension
# VS Code: Search "Cline" in Extensions (1.8M+ users)
# VSCodium: Install from Open VSX Registry
# Windsurf: Available in Windsurf marketplace

Connect to BitRouter

Choose your setup:

Option 1: VS Code Settings

// .vscode/settings.json
{
  "cline.apiProvider": "custom",
  "cline.customApiEndpoint": "http://localhost:8787",
  "cline.customApiProtocol": "openai"
}

Option 2: Project Settings

// .vscode/settings.json in project
{
  "cline.providers": {
    "bitrouter": {
      "baseUrl": "http://localhost:8787",
      "models": ["*"]
    }
  },
  "cline.defaultProvider": "bitrouter"
}

Option 3: Environment Variables

export CLINE_API_BASE=http://localhost:8787
export CLINE_API_PROVIDER=bitrouter
code .

Essential Configuration

Multi-Provider Routing

# ~/.bitrouter/config.yaml
routes:
  # Main Cline operations
  - match: "cline/*"
    provider: anthropic
    model: claude-3-5-sonnet-latest
    
  # Quick edits
  - match: "cline/quick/*"
    provider: openai
    model: gpt-4o-mini
    
  # Complex refactoring
  - match: "cline/refactor/*"
    provider: openai
    model: o1-preview
    
  # Local models
  - match: "cline/local/*"
    provider: ollama
    endpoint: http://localhost:11434

Approval Workflow

approval:
  cline:
    required: true
    actions:
      file_creation:
        require_approval: true
        show_diff: true
      file_editing:
        require_approval: true
        show_diff: true
      terminal_commands:
        require_approval: true
        allow_list: ["npm test", "git status"]
      browser_automation:
        require_approval: true

MCP Integration

mcp:
  cline:
    marketplace: true
    gateway: bitrouter
    servers:
      - name: filesystem
        source: marketplace
        route: "cline/mcp/fs"
      - name: github
        source: marketplace
        route: "cline/mcp/github"
      - name: postgres
        source: marketplace
        route: "cline/mcp/postgres"

Common Recipes

Recipe: Safety First

security:
  cline:
    guardrails:
      - type: secret_detection
        action: block
        patterns: [api_key, password, token]
      - type: file_protection
        protected: ["*.env", ".git/*"]
      - type: command_filtering
        block: ["rm -rf", "format c:", "sudo"]

Recipe: Multi-Editor Support

// VSCodium settings
{
  "cline.apiProvider": "custom",
  "cline.customApiEndpoint": "http://localhost:8787"
}
<!-- IntelliJ .idea/cline.xml -->
<component name="ClineSettings">
  <option name="provider" value="bitrouter" />
  <option name="endpoint" value="http://localhost:8787" />
</component>

Recipe: Diff View Integration

diff_view:
  cline:
    enabled: true
    features:
      - syntax_highlighting
      - side_by_side
      - inline_comments
    routing:
      generate: "cline/diff/generate"
      review: "cline/diff/review"

VS Code Configuration

{
  "cline.sidebar": {
    "position": "left",
    "defaultOpen": true
  },
  "cline.bitrouter": {
    "enabled": true,
    "showCosts": true,
    "showLatency": true,
    "showProvider": true
  },
  "cline.interface": {
    "theme": "auto",
    "fontSize": 14
  }
}

Keyboard Shortcuts

// keybindings.json
[
  {
    "key": "cmd+shift+c",
    "command": "cline.open",
    "when": "editorTextFocus"
  },
  {
    "key": "cmd+shift+a",
    "command": "cline.approveAction",
    "when": "cline.pendingApproval"
  }
]

Monitoring

Session Tracking

# View Cline sessions
bitrouter sessions list --agent cline

# Session with approvals
bitrouter sessions show <id> --include-approvals

# Export for review
bitrouter sessions export <id> --format markdown

Cost Analysis

# Cline spending
bitrouter costs breakdown --agent cline

# Cost per file edited
bitrouter costs analyze --agent cline --group-by file

# Spending alerts
bitrouter budget set --agent cline --hourly 5.00

Troubleshooting

🔴 Connection Failed

# Check BitRouter
curl http://localhost:8787/health

# Cline extensions
code --list-extensions | grep cline

# Test via Command Palette
# "Cline: Test Connection"

🟡 Approval Issues

# Check approval settings
bitrouter config show cline.approval

# Pending approvals
bitrouter approvals list --agent cline

# Clear stuck approvals
bitrouter approvals clear --agent cline

🔵 MCP Tool Failures

# List MCP tools
bitrouter mcp list --agent cline

# Test specific tool
bitrouter mcp test --tool filesystem

# Check logs
bitrouter logs --filter "cline/mcp"

Advanced Features

Task Planning

task_planning:
  cline:
    enabled: true
    planning:
      route: "cline/planning/*"
      model: claude-3-5-sonnet-latest
      require_approval: true
    execution:
      route: "cline/execution/*"
      model: gpt-4o
      step_by_step: true

Custom Commands

// Custom Cline command
import { commands, window } from 'vscode';

export function registerCommands(context) {
  commands.registerCommand('cline.customRefactor', async () => {
    const input = await window.showInputBox({
      prompt: 'Describe the refactoring'
    });
    
    await cline.execute({
      action: 'refactor',
      route: 'cline/custom/refactor',
      description: input
    });
  });
}

Workflow Automation

workflows:
  cline:
    - name: "test-driven-development"
      trigger: file_save
      route: "cline/workflow/tdd"
      steps: [write_test, run_test, implement_feature]
    - name: "code-review"
      trigger: pre_commit
      route: "cline/workflow/review"
      require_approval: true

Learn More

How is this guide?

Last updated on

On this page