Start the MCP Server

The VS Code extension connects to a local MCP Server running in HTTP mode:

VERTAAUX_API_KEY=vx_live_xxx npx @vertaaux/mcp-server --http

You should see:

VertaaUX MCP Server v2.0.0
HTTP server listening on port 3001

Keep this terminal open while using the extension.

Install the Extension

Option A: VS Code Marketplace

1. Open VS Code
2. Press Cmd+Shift+X (Mac) or Ctrl+Shift+X (Windows/Linux)
3. Search "VertaaUX"
4. Click Install

Option B: Command Line

code --install-extension vertaaux.vertaaux-assistant

Verify Connection

Check that the extension can reach your MCP Server:

1. Open VS Code settings (Cmd+, or Ctrl+,)
2. Search for "vertaaux"
3. Confirm Mcp Server is set to http://localhost:3001

If you started the server on a different port, update this setting.

Open a File

Open any React, Vue, HTML, or Svelte file. For example:

export function Button({ onClick }) {
  return (
    <button onClick={onClick} style={{ padding: '4px 8px' }}>
      Click me
    </button>
  );
}

Run Your First Scan

1. Open the Command Palette: Cmd+Shift+P (Mac) or Ctrl+Shift+P (Windows/Linux)
2. Type "VertaaUX: Scan Current File"
3. Press Enter

Wait a few seconds for the scan to complete.

See the Results

Results appear in two places:

1. Problems Panel

Press Cmd+Shift+M (Mac) or Ctrl+Shift+M (Windows/Linux) to open the Problems panel. UX issues appear with severity icons.

2. VertaaUX Issues Panel

Click the VertaaUX icon in the Activity Bar (left sidebar) to see the Issues TreeView. This shows all issues grouped by file.