Looker VS Code Extension

This extension provides support for LookML development in VS Code-based IDEs, including syntax highlighting, autocomplete, and file synchronization with your Looker instance.

Features

• Syntax Highlighting: Rich coloring for .lkml files to make code easier to read.
• LookML Validation: Syntax errors are highlighted in real-time as you type and save. Run a full validation of your project via the command palette or context menu.
• Autocomplete: Context-aware suggestions for LookML parameters (explore, view, dimension, measure, etc.).
• Live Synchronization: Keeps files in real-time sync with your Looker dev mode copy without needing to use Git.
• Git Integration: Keeps Looker and your local Git clone in sync.
• Authentication: Sign in using OAuth or Looker API credentials.

Getting Started

Here's how to get started with agentic LookML development with an agentic VS Code-based editor.

1. Install and run the MCP Toolbox for Databases server

To provide the agent with access to the Looker API (run queries, inspect SQL, inspect the LookML model, and inspect connection schema information), you need a running, local MCP Toolbox for Databases server.

The recommended approach is to use npx. You can provide your Looker instance URL and API credentials as inline environment variables, or you can set them in your shell environment.

For OAuth:

LOOKER_BASE_URL="https://your-instance.looker.com" \
LOOKER_USE_CLIENT_OAUTH=true \
npx @toolbox-sdk/server --prebuilt=looker,looker-dev

For client ID & secret:

LOOKER_BASE_URL="https://your-instance.looker.com" \
LOOKER_CLIENT_ID="YOUR_CLIENT_ID" \
LOOKER_CLIENT_SECRET="YOUR_CLIENT_SECRET" \
npx @toolbox-sdk/server --prebuilt=looker,looker-dev

For more advanced installation and configuration options, see the official documentation.

2. Configure the extension to connect to Looker and the MCP Toolbox for Databases server

1. In your IDE, use CMD-SHIFT-P (Mac) or CTRL+SHIFT+P (Linux/Windows) to open the command palette and choose Preferences: Open Workspace Settings (JSON).

2. Update your Workspace Settings to configure the extension based on your preferred authentication approach:

3. OAuth (Recommended): OAuth is recommended because it provides a secure authorization flow without storing secrets in the editor. A Looker admin must register the Looker VS Code extension as an OAuth client in Looker's API Explorer and provide you with an OAuth client ID. The OAuth client ID is the same as the client_guid in the API Explorer. Add the following to your Workspace Settings:

   ```json
   {
     "looker.instanceURL": "https://your-instance.looker.com",
     "looker.oauthClientId": "YOUR_OAUTH_CLIENT_ID",
     "looker.projectId": "your_project_name"
   }
   ```
   

   2. Client ID & Secret (API Key): Add the following to your Workspace Settings:

      {
        "looker.instanceURL": "https://your-instance.looker.com",
        "looker.clientId": "YOUR_API_KEY_CLIENT_ID",
        "looker.clientSecret": "YOUR_API_KEY_CLIENT_SECRET",
        "looker.projectId": "your_project_name"
      }
      

   3. By default the MCP for Databases server runs on port 5000. If you used a different port, update looker.mcpServerUrl, e.g.:

      "looker.mcpServerUrl": "http://localhost:7171/mcp"
      

4. In the Output tab in your IDE, check the Looker channel for any errors.

3. Configure your IDE to connect to the extension's MCP proxy

1. Follow the your IDE's documentation to open your mcp_config.json.

2. Add the following to your mcp_config.json:

   {
       "mcpServers": {
           "Looker": {
               "serverUrl": "http://127.0.0.1:5050",
               "disabledTools": [
                   "get_project_files",
                   "get_project_file",
                   "create_project_file",
                   "update_project_file",
                   "delete_project_file",
                   "run_dashboard",
                   "get_dashboards",
                   "make_dashboard",
                   "add_dashboard_filter",
                   "add_dashboard_element",
                   "get_looks",
                   "make_look",
                   "generate_embed_url",
                   "health_analyze",
                   "health_vacuum",
                   "health_pulse",
                   "query_url"
               ]
           }
       }
   }
   

   Note that here, serverUrl refers to the URL of the MCP proxy run by the extension, not the MCP Server you set up in Step 1.

Note: We disable the file system tools because the extension already handles file operations.

Usage

1. Clone a LookML Project: Clone your LookML project's Git repository to your local machine.
2. Open the Project: Open the cloned folder in VS Code.
3. Switch Branch: Ensure you are on the desired Git branch locally. The extension will automatically switch your Looker session to this branch.
4. Edit: Open a file. The extension will fetch the latest content from Looker. Be aware that this may overwrite local changes if they differ from Looker's version.
5. Save: Saving a file pushes the changes to Looker immediately.
6. Prompt the agent: Use your AI agent to assist you. For example, ask "Please add a new dimension for user_id to the users view."

Troubleshooting & Logs

If you encounter issues, you can view the extension's logs in the VS Code Output panel.

Viewing Logs:

1. Open the Output panel using the VS Code command palette (CMD-SHIFT-P on Mac, CTRL+SHIFT+P on Windows/Linux) and selecting View: Toggle Output. Alternatively, use the shortcut CMD-SHIFT-U (Mac) or CTRL+SHIFT+U (Windows/Linux).
2. In the dropdown menu on the right side of the Output panel, select Looker.

Changing the Log Level:

1. Open the command palette (CMD-SHIFT-P on Mac, CTRL+SHIFT+P on Windows/Linux) and select Developer: Set Log Level....
2. Select Looker from the dropdown of extensions.
3. Choose your desired logging level (e.g., Debug or Trace for more verbose output, or Info for standard output).

Configuration Reference

You can configure the following settings in your workspace VS Code settings.json (or via the Settings UI under Looker):

Note: We recommend using workspace settings rather than user (global) settings because they are specific to a Looker instance and project.

MCP Proxy

This VS Code extension includes a built-in proxy for the MCP Toolbox for Databases server.

Why?

AI agents can act extremely fast. Because the VS Code extension syncs local changes to Looker asynchronously, a race condition can occur where the agent queries the MCP server before its file edits have been uploaded to Looker.

The built-in MCP proxy solves this by waiting for all active file syncs to complete before forwarding the agent's MCP requests to the underlying MCP server.

Configuring the Proxy

1. Set looker.mcpServerUrl to the destination URL of your MCP Toolbox for Databases server (e.g., http://localhost:5000/mcp).
2. When the extension starts, the proxy will listen locally on port 5050 (default: http://127.0.0.1:5050) and forward requests to the URL defined in looker.mcpServerUrl.

Note: If port 5050 is occupied, the extension will try to run the proxy on an arbitrary available port. Check the "Looker" Output channel in VS Code for the exact proxy URL in this case.