MCP 插件配置实战：browser-tools-mcp 示例

环境准备

首先确保本地已安装 Python 和 Node.js 环境。在指定目录下创建项目文件夹并克隆仓库，这里以 Windows 路径为例：

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 install @agentdeskai/[email protected]
npx @agentdeskai/[email protected]
npx @agentdeskai/[email protected]

具体安装细节可参考官方文档，过程中留意控制台输出是否有报错。

浏览器插件配置

接下来需要加载浏览器扩展。下载对应版本的 zip 包并在浏览器扩展管理界面选择'加载已解压的扩展程序'：

下载地址

加载成功后，浏览器侧边栏应出现相关图标。

Cline 服务配置

最后一步是在 Cline 中注册 MCP 服务。修改配置文件，指向本地启动脚本的路径。注意路径需根据实际安装位置调整：

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

保存配置并重启服务，确保 autoApprove 列表按需填写权限。

验证效果

配置完成后，浏览器端调试工具面板会新增入口，说明集成成功。

至此，插件已正常接入 AI 开发环境，可进行后续调试操作。