Docs

Docs

Setup Guide

Learn how to configure GitHub Copilot in VS Code and JetBrains IDEs to access Vaadin documentation through the Model Context Protocol server

GitHub Copilot supports MCP servers when used in Agent mode in both VS Code and JetBrains IDEs. This enables Copilot to access Vaadin documentation for more accurate code suggestions and responses.

Important

MCP servers only work when GitHub Copilot is used in Agent mode. Regular Copilot Chat does not support MCP.

Enterprise customers: Organizations with Copilot Business or Enterprise must enable the "MCP servers in Copilot" policy (disabled by default).

VS Code Configuration

Requirements:

  • VS Code 1.99 or later

  • GitHub Copilot extension with Agent mode enabled

Setup Steps

  1. Create .vscode/mcp.json in your project root

  2. Add the following configuration:

Source code
JSON
{
  "servers": {
    "vaadin": {
      "type": "http",
      "url": "https://mcp.vaadin.com/docs"
    }
  }
}

  1. Click the Start button that appears at the top of the MCP servers list

  2. Switch to Agent mode: Open Copilot Chat → Click mode selector → Select "Agent"

  3. Click the tools icon in Agent mode to view available MCP servers

Tip

The .vscode/mcp.json file is project-specific. If you want to use the Vaadin MCP server across multiple projects, you’ll need to add this configuration to each project.

Switching to Agent Mode

Agent mode is required for MCP server support:

  1. Open the Copilot Chat panel in VS Code

  2. Look for the mode selector at the top of the chat

  3. Click it and select "Agent" from the drop-down

  4. The tools icon should now appear, showing available MCP servers

Verify the Setup

After configuration:

  1. Ensure Agent mode is active

  2. Click the tools icon to verify the Vaadin server appears in the list

  3. Ask a question about Vaadin (e.g., "How to create a Grid in Vaadin?")

  4. Copilot uses the Vaadin MCP server to provide documentation-based responses

JetBrains IDEs Configuration

Requirements:

  • JetBrains IDE with GitHub Copilot plugin

  • Agent mode enabled (public preview as of May 2025)

Setup Steps

  1. Create .copilot/mcp-config.json in your project root

  2. Add the following configuration:

Source code
JSON
{
  "servers": {
    "vaadin": {
      "type": "http",
      "url": "https://mcp.vaadin.com/docs"
    }
  }
}

  1. Restart your JetBrains IDE

  2. Enable Agent mode in GitHub Copilot settings

  3. Access the MCP server through Copilot Agent interactions

Tip

For best results, create the .copilot/mcp-config.json file before starting your IDE. This ensures the configuration is properly loaded.

Enterprise Configuration

For organizations using Copilot Business or Enterprise:

  1. An administrator must enable the "MCP servers in Copilot" policy

  2. This setting is found in the GitHub organization’s Copilot policies

  3. Individual developers can then configure MCP servers in their projects

  4. Contact your GitHub organization administrator if you don’t see this option

Resources