MCP Server Setup

Model Context Protocol (MCP) is an open standard that enables AI models to interact with external tools and services through a unified interface. The ESLint CLI contains an MCP server that you can register with your code editor to allow LLMs to use ESLint directly.

Set Up ESLint MCP Server in VS Code

To use MCP servers in VS Code, you must have the Copilot Chat extension installed. After that, follow these steps so add the ESLint MCP server:

1. Create MCP Configuration File

Create a .vscode/mcp.json file in your project with the following configuration:

{
	"servers": {
		"ESLint": {
			"type": "stdio",
			"command": "npx",
			"args": ["eslint", "--mcp"]
		}
	}
}
1
2
3
4
5
6
7
8
9

Alternatively, you can use the Command Palette:

Press Ctrl+Shift+P (Windows/Linux) or Cmd+Shift+P (macOS)
Type and select MCP: Add Server
Select Command (stdio) from the dropdown
Enter npx eslint --mcp as the command
Type ESLint as the server ID
Choose Workspace Settings to create the configuration in .vscode/mcp.json

2. Enable MCP Server in User Settings (Optional)

If you want to use the ESLint MCP server across all workspaces, you can follow the previous steps and choose User Settings instead of Workspace Settings to add the MCP server to your settings.json file.

Using the ESLint MCP Server with GitHub Copilot

Once your MCP server is configured, you can use it with GitHub Copilot’s agent mode:

Open the Copilot Chat view in VS Code
Ensure agent mode is enabled (look for the agent icon in the chat input)
Toggle on the ESLint MCP server tools using the “Tools” button in the chat view
Ask Copilot to perform ESLint tasks, such as:
- “Check this file for linting errors”
- “Fix all ESLint issues in the current file”
- “Show me what ESLint rules are being violated”

Troubleshooting

If you encounter issues with the ESLint MCP server:

Check the MCP server status by running MCP: List Servers from the Command Palette
Select the ESLint server and choose Show Output to view server logs
Ensure that ESLint is installed in your project or globally
Verify that your MCP configuration is correct

Set Up ESLint MCP Server in Cursor

To configure the ESLint MCP server in Cursor, follow these steps:

1. Create MCP Configuration File

Create a .cursor/mcp.json file in your project directory with the following configuration:

{
	"mcpServers": {
		"eslint": {
			"command": "npx",
			"args": ["eslint", "--mcp"],
			"env": {}
		}
	}
}
1
2
3
4
5
6
7
8
9

2. Global Configuration (Optional)

If you want to use the ESLint MCP server across all your Cursor workspaces, create a ~/.cursor/mcp.json file in your home directory with the same configuration.

3. Verify Tool Availability

Once configured, the ESLint MCP server should appear in the “Available Tools” section on the MCP settings page in Cursor.

Set Up ESLint MCP Server in Windsurf

To configure the ESLint MCP server in Windsurf, follow these steps:

1. Access Windsurf Settings

Navigate to Windsurf - Settings > Advanced Settings, or open the Command Palette and select “Open Windsurf Settings Page”.

2. Add ESLint MCP Server

Scroll down to the Cascade section and click the “Add Server” button. Then select “Add custom server +”.

3. Configure MCP Server

Add the following configuration to your ~/.codeium/windsurf/mcp_config.json file:

{
	"mcpServers": {
		"eslint": {
			"command": "npx",
			"args": ["eslint", "--mcp"],
			"env": {}
		}
	}
}
1
2
3
4
5
6
7
8
9

4. Refresh Server List

After adding the configuration, press the refresh button to update the list of available MCP servers.

5. Using ESLint with Cascade

Once configured, you can use ESLint tools with Cascade by asking it to:

Check files for linting errors
Explain ESLint rule violations

Note: MCP tool calls in Windsurf will consume credits regardless of success or failure.

Example Prompts

Here are some prompts you can use to run ESLint with Copilot:

Lint the current file and explain any issues found

Lint and fix #file:index.js
1
2
3

Additional Resources

Edit this page