VS Code Setup Guide

Complete guide to integrating Bootspring with Visual Studio Code.

Overview#

Bootspring integrates with VS Code through:

1. Extension - UI integration, status bar, commands
2. Terminal - CLI access within VS Code
3. Context - CLAUDE.md file for AI assistants

Prerequisites#

• VS Code 1.80.0 or higher
• Node.js 18+ installed
• Bootspring CLI installed (npm install -g bootspring)

Extension Installation#

From Marketplace#

1. Open VS Code
2. Press Ctrl+Shift+X (or Cmd+Shift+X on macOS)
3. Search "Bootspring"
4. Click "Install"

From Command Line#

From VSIX (Offline)#

Extension Features#

Status Bar#

The status bar shows:

• Current project status
• Generation state
• Quick actions

Click to access commands.

Command Palette#

Access Bootspring commands via Ctrl+Shift+P:

Keyboard Shortcuts#

Default shortcuts (customizable):

Context Menu#

Right-click options in editor:

• "Generate Context for Selection"
• "Ask Agent About This Code"
• "Apply Skill Pattern"

Right-click options in explorer:

• "Generate Context for Folder"
• "Initialize Bootspring Project"

Extension Settings#

Open settings: Ctrl+, then search "Bootspring"

General Settings#

Terminal Settings#

Agent Settings#

Workflow Settings#

Terminal Integration#

Using Integrated Terminal#

Open terminal: Ctrl+`

Dedicated Bootspring Terminal#

Create a dedicated profile in settings:

Tasks#

Create .vscode/tasks.json:

Run tasks: Ctrl+Shift+B

Snippets#

Built-in Snippets#

The extension provides snippets for common patterns:

Custom Snippets#

Add to .vscode/bootspring.code-snippets:

Code Lens#

The extension adds CodeLens features:

Agent Suggestions#

Above complex functions:

Skill Recommendations#

Above patterns:

Enable/disable in settings:

Explorer Integration#

Bootspring View#

A dedicated sidebar view showing:

• Project status
• Available agents
• Recent workflows
• Quick actions

Enable: View → Open View → Bootspring

File Decorations#

Files show decorations for:

• 📋 CLAUDE.md - Context file
• ⚙️ bootspring.config.js - Config file
• 📂 .bootspring/ - Data directory

Problems Panel#

Bootspring integrates with the Problems panel:

Quality Issues#

After running bootspring quality:

Configuration Issues#

Output Channel#

View Bootspring logs: View → Output → Bootspring

Log levels:

• [INFO] - General information
• [DEBUG] - Detailed debugging
• [ERROR] - Errors and issues

Configure logging:

Workspace Configuration#

Multi-Root Workspaces#

Bootspring works with multi-root workspaces:

Per-Folder Settings#

.vscode/settings.json in each folder:

GitHub Copilot Integration#

Use Bootspring context with Copilot:

Context Sharing#

CLAUDE.md provides context that Copilot can read:

Copilot sees this context and adapts suggestions.

Complementary Usage#

1. Copilot - Quick inline completions
2. Bootspring Agents - Complex architecture decisions
3. Bootspring Skills - Production patterns

Debugging Integration#

Debug Context Generation#

Launch configuration in .vscode/launch.json:

Remote Development#

Remote - SSH#

Bootspring works over SSH:

1. Connect to remote
2. Install Bootspring on remote: npm install -g bootspring
3. Extension syncs automatically

Dev Containers#

.devcontainer/devcontainer.json:

GitHub Codespaces#

Works automatically in Codespaces:

Troubleshooting#

Extension Not Loading#

1. Check VS Code version (1.80.0+)
2. Reload window: Ctrl+Shift+P → "Reload Window"
3. Check extension output for errors

Commands Not Working#

Context Not Generating#

1. Check config file exists
2. Verify permissions
3. Check output channel for errors

Status Bar Missing#

Performance Issues#

Recommended Extensions#

Complementary extensions:

Install together:

Uninstalling#

Remove Extension#

1. Open Extensions (Ctrl+Shift+X)
2. Find "Bootspring"
3. Click "Uninstall"

Or via command line:

Clean Settings#

Remove Bootspring settings from:

• User settings: ~/.config/Code/User/settings.json
• Workspace settings: .vscode/settings.json

Next Steps#

• Claude Desktop Setup
• Generate Context
• Using Agents
• Quality Gates