MCP 插件配置实战：browser-tools-mcp 集成指南

环境准备

首先确保本地开发环境就绪。本示例基于 Windows 系统，需提前安装 Python 和 Node.js。

# 创建项目目录
mkdir C:\Users\Suoxd\Documents\Cline\MCP\browser-tools-mcp
cd C:\Users\Suoxd\Documents\Cline\MCP\browser-tools-mcp
# 克隆仓库
git clone https://github.com/AgentDeskAI/browser-tools-mcp.git .

安装与启动服务

进入目录后，使用 npm 安装依赖并启动服务。注意版本号匹配，这里以 v1.2.0 为例。

npm install @agentdeskai/[email protected]
npx @agentdeskai/[email protected]
npx @agentdeskai/[email protected]

详细安装文档可参考官方仓库。

浏览器插件配置

下载并安装对应的浏览器扩展程序，以便在浏览器端进行调试交互。

下载地址

安装完成后，浏览器侧边栏将显示相应的工具面板。

Cline 服务配置

在 Cline 的配置文件中添加以下 MCP 服务定义，指向本地启动的节点脚本。请根据实际路径调整 args 中的文件位置。

{
  "browser-tools-mcp": {
    "command": "node",
    "args": ["d:/Suo/code/tmp-AI/browser-tools-mcp/browser-tools-mcp/dist/mcp-server.js"],
    "disabled": false,
    "autoApprove": []
  }
}

效果验证

配置成功后，浏览器端应能正常加载调试工具页面，实现与 AI 助手的交互。