Integrates the OpenCode web UI into a VS Code sidebar panel.
Features
- Opens OpenCode web interface in a right-side panel (
ViewColumn.Beside)
- Starts the OpenCode server on-demand or automatically
- Editor title button to toggle the panel open/close (changes icon when panel is open)
- Status bar indicator showing connection state
- Auto-reconnect when the server disconnects
- Theme sync: OpenCode follows VS Code's light/dark theme
- Proxy with CSP header stripping for secure iframe embedding
- "View Logs" and "Settings" links in the panel
Usage
- Click the OpenCode icon in the editor title bar
- Or press
Ctrl+Shift+O (Cmd+Shift+O on macOS)
- Click "Start Server" in the panel to start the OpenCode server
- The OpenCode web UI will load inside the panel
Extension Settings
This extension contributes the following settings:
opencode-sidebar-web.autoStart: Automatically start the OpenCode server when VS Code opens
opencode-sidebar-web.autoReconnect: Automatically reconnect when the server disconnects
opencode-sidebar-web.maxReconnectAttempts: Maximum number of reconnection attempts (default: 3)
opencode-sidebar-web.hostname: Hostname for the OpenCode server (default: 127.0.0.1)
opencode-sidebar-web.hideButton: Hide the OpenCode button from the editor title bar
Requirements
- VS Code 1.118.0 or higher
- The
opencode-ai npm package (bundled)
Known Issues
- Server startup requires a working OpenCode binary (automatically detected from node_modules)
- The iframe uses a local proxy to remove CSP headers for embedding
| |