Index

MCP 服务器设置

模型上下文协议（MCP）是一种开放标准，允许 AI 模型通过统一接口与外部工具和服务进行交互。ESLint CLI 包含一个 MCP 服务器，你可以将其注册到你的代码编辑器中，以允许大语言模型（LLM）直接使用 ESLint。

在 VS Code 中设置 ESLint MCP 服务器

🌐 Set Up ESLint MCP Server in VS Code

要在 VS Code 中使用 MCP 服务器，你必须先安装 Copilot Chat 扩展。之后，按照以下步骤添加 ESLint MCP 服务器：

🌐 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. 创建 MCP 配置文件

🌐 1. Create MCP Configuration File

在你的项目中创建一个 .vscode/mcp.json 文件，并使用以下配置：

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

{
	"servers": {
		"ESLint": {
			"type": "stdio",
			"command": "npx",
			"args": ["@eslint/mcp@latest"]
		}
	}
}

或者，你可以使用命令面板：

🌐 Alternatively, you can use the Command Palette:

  1. 按 Ctrl+Shift+P（Windows/Linux）或 Cmd+Shift+P（macOS）
  2. 输入并选择 MCP: Add Server
  3. 从下拉菜单中选择 Command (stdio)
  4. 输入 npx @eslint/mcp@latest 作为命令
  5. 输入 ESLint 作为服务器ID
  6. 选择 Workspace Settings 在 .vscode/mcp.json 中创建配置

2. 在用户设置中启用 MCP 服务器（可选）

🌐 2. Enable MCP Server in User Settings (Optional)

如果你想在所有工作区使用 ESLint MCP 服务器，你可以按照之前的步骤操作，并选择 User Settings 而不是 Workspace Settings 将 MCP 服务器添加到你的 settings.json 文件中。

🌐 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.

在 GitHub Copilot 中使用 ESLint MCP 服务器

🌐 Use the ESLint MCP Server with GitHub Copilot

一旦你的 MCP 服务器配置完成，你就可以将其与 GitHub Copilot 的代理模式 一起使用：

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

  1. 在 VS Code 中打开 Copilot Chat 视图
  2. 确保已启用代理模式（在聊天输入框中查找代理图标）
  3. 在聊天视图中使用“工具”按钮切换 ESLint MCP 服务器工具
  4. 请求 Copilot 执行 ESLint 任务，例如：
    • “检查此文件的代码规范错误”
    • “修复当前文件中的所有 ESLint 问题”
    • “告诉我哪些 ESLint 规则被违反了”

故障排除

🌐 Troubleshooting

如果你在使用 ESLint MCP 服务器时遇到问题：

🌐 If you encounter issues with the ESLint MCP server:

  1. 通过在命令面板中运行 MCP: List Servers 检查 MCP 服务器状态
  2. 选择 ESLint 服务器并选择 Show Output 查看服务器日志
  3. 确保 ESLint 已安装在你的项目中或全局环境中
  4. 验证你的 MCP 配置是否正确

在 Cursor 中设置 ESLint MCP 服务器

🌐 Set Up ESLint MCP Server in Cursor

要在 Cursor 中配置 ESLint MCP 服务器，请按照以下步骤操作：

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

1. 创建 MCP 配置文件

🌐 1. Create MCP Configuration File

在你的项目目录中创建一个 .cursor/mcp.json 文件，并使用以下配置：

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

{
	"mcpServers": {
		"eslint": {
			"command": "npx",
			"args": ["@eslint/mcp@latest"],
			"env": {}
		}
	}
}

2. 全局配置（可选）

🌐 2. Global Configuration (Optional)

如果你想在所有 Cursor 工作区使用 ESLint MCP 服务器，请在你的主目录中创建一个 ~/.cursor/mcp.json 文件，并使用相同的配置。

🌐 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. 验证工具可用性

🌐 3. Verify Tool Availability

配置完成后，ESLint MCP 服务器应出现在 Cursor 的 MCP 设置页面的“可用工具”部分。

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

在 Windsurf 中设置 ESLint MCP 服务器

🌐 Set Up ESLint MCP Server in Windsurf

要在 Windsurf 中配置 ESLint MCP 服务器，请按照以下步骤操作：

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

1. 访问风帆设置

🌐 1. Access Windsurf Settings

导航到 Windsurf - 设置 > 高级设置，或打开命令面板并选择“打开 Windsurf 设置页面”。

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

2. 添加 ESLint MCP 服务器

🌐 2. Add ESLint MCP Server

向下滚动到级联部分，然后点击“添加服务器”按钮。然后选择“添加自定义服务器 +”。

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

3. 配置 MCP 服务器

🌐 3. Configure MCP Server

将以下配置添加到你的 ~/.codeium/windsurf/mcp_config.json 文件中：

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

{
	"mcpServers": {
		"eslint": {
			"command": "npx",
			"args": ["@eslint/mcp@latest"],
			"env": {}
		}
	}
}

4. 刷新服务器列表

🌐 4. Refresh Server List

添加配置后，点击刷新按钮更新可用 MCP 服务器列表。

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

5. 使用带有级联的 ESLint

🌐 5. Use ESLint with Cascade

配置完成后，你可以通过以下方式将 ESLint 工具与 Cascade 结合使用：

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

  • 检查文件是否存在 linting 错误
  • 解释 ESLint 规则违规

注意：Windsurf 中的 MCP 工具调用无论成功与否都会消耗积分。

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

示例提示

🌐 Example Prompts

以下是一些提示 LLM 运行 ESLint 并处理其发现的示例：

🌐 Here are some example prompts to an LLM for running ESLint and addressing its findings:

Lint the current file and explain any issues found

Lint and fix #file:index.js

其他资源

🌐 Additional Resources