VibeLens Extension

VS Code / Cursor extension that displays AI-generated code explanations with inline annotations.

Features

Diff visualization — Side-by-side or unified view powered by diff2html
Inline annotations — AI explanations appear directly in the diff
Action buttons — Click to send improvement prompts to Cursor chat
Workspace-aware — Only activates in the correct project window
Auto-install MCP — Configures the MCP server automatically on first run

Installation

From VSIX

Download .vsix from releases
In VS Code/Cursor: Extensions → ... → "Install from VSIX..."
Reload the window

The extension automatically adds the MCP server to your Cursor/Windsurf configuration.

From Marketplace

VS Code extension ID: kevcode.vibelens-extension
Cursor/Open VSX extension ID: kevcode.vibelens-extension

From Source

cd packages/extension
pnpm install
pnpm run build
pnpm run package

Then install the generated .vsix file.

Usage

Once installed, the extension:

Watches ~/.vibelens/pending.json for new explanations
Opens a webview panel when the MCP server writes new data
Displays the diff with syntax highlighting and annotations

Commands

VibeLens: Show Panel — Manually open the panel with the last explanation

Deep Links

The extension registers a URI handler:

cursor://kevcode.vibelens-extension/show
vscode://kevcode.vibelens-extension/show

How It Works

MCP Server                    Extension
     │                            │
     │ writes to                  │ watches
     │ ~/.vibelens/               │ ~/.vibelens/
     │ pending.json               │ pending.json
     └────────────────────────────┘
                                  │
                                  ▼
                            Webview Panel
                            (diff + annotations)

The MCP server writes a JSON file with:

title — Panel title
summary — Overview of changes
diff — Git diff content
annotations — Array of explanations with optional actions
workspacePath — Project path (for workspace filtering)
editor — "cursor" or "vscode"

The extension watches this file and opens a webview when it changes.

Development

# Build
pnpm run build

# Watch mode
pnpm run watch

# Package as .vsix
pnpm run package

Configuration

The extension auto-configures MCP servers in:

Cursor: ~/.cursor/mcp.json
Windsurf: ~/.codeium/windsurf/mcp_config.json

VS Code native MCP support (1.101+) doesn't use file-based config.

License

MIT

VibeLens

kevcode