chrome-devtools-mcp

环境要求

• 支持 MCP 的客户端，如 Antigravity、Claude Code、Cursor、Copilot / VS Code 等
• 已安装 Node.js / npm（配置中使用 npx 启动服务器）
• 本地已安装 Google Chrome 或 Chrome for Testing 浏览器

安装与启动步骤

1. 1确认前置环境

   确认 MCP 客户端可用、本机有 Chrome 浏览器；服务器通过 npx 拉取，无需手动下载源码。

2. 2添加 MCP 配置

   在 MCP 客户端的配置文件中加入下面这段 JSON，用 npx 启动 chrome-devtools-mcp。

   {
     "mcpServers": {
       "chrome-devtools": {
         "command": "npx",
         "args": ["-y", "chrome-devtools-mcp@latest"]
       }
     }
   }

   复制

3. 3重启客户端验证

   保存配置后重启 MCP 客户端，确认 chrome-devtools 服务器已连接，再让智能体操作浏览器。

4. 4插件方式装 skills

   Claude Code 可直接通过插件市场一次性安装 MCP 服务器和全部 skills（含 CLI skill）。

   /plugin marketplace add ChromeDevTools/chrome-devtools-mcp
   /plugin install chrome-devtools-mcp@chrome-devtools-plugins

   复制

5. 5全局安装 npm 包

   若客户端不支持插件，可全局安装 npm 包，再把其中的 skill 文件夹复制到智能体的 skills 目录。

   npm i chrome-devtools-mcp@latest -g

   复制

6. 6关闭使用统计

   数据收集默认开启；在启动参数中加 --no-usage-statistics 可退出统计。

关键配置

如何确认成功

重启 MCP 客户端后，服务器 chrome-devtools 显示已连接，智能体能打开页面并读取控制台日志即可。

常见问题

注意事项

• MCP 客户端可读取并修改浏览器内数据，请勿在受控浏览器中登录敏感账号。
• Chrome 浏览器自身的统计开关与该工具的统计收集相互独立，互不影响。
• 更多启动参数（如 --headless、--isolated）与 WebSocket 连接方式见官方 Configuration Guide。
• 并发会话、持久化用户目录、连接已运行 Chrome 或 Android 调试等高级用法见 Advanced Usage Guide。