牛逼啊,Chrome DevTools 官方下场做 MCP 了。
以前我们用 Cursor、Claude Code 这些编码 agent 写前端,遇到页面出问题的时候,agent 能做的事很有限。它看不到浏览器里真正发生了什么,只能让你截个图发过来,然后对着图片猜问题出在哪。有时候猜对了,有时候来来回回好几轮还在瞎改。
现在 Chrome DevTools 团队自己出了一个 MCP server,叫 chrome-devtools-mcp,直接把浏览器的调试能力开放给了 AI agent。什么意思呢?就是你的编码 agent 现在可以像你按 F12 一样,直接拿到真实的 DOM 结构、网络请求、控制台日志,甚至可以录制性能分析、做无障碍审计、排查内存泄漏。
跟以前靠截图猜的体验比,完全是两回事。
支持的客户端也很全,Claude Code、Cursor、Copilot、VS Code、Gemini CLI 都能接。配置很简单,基本就是在 MCP 配置里加一段 JSON,一条 npx 命令就跑起来了。它还自带了一组 skills,专门教 agent 怎么用 DevTools 的各种能力,调试 cookie 和鉴权、优化 LCP、排查内存泄漏,这些比较细的调试场景都覆盖到了。
比较值得关注的是,这个项目发布在 ChromeDevTools 的官方 GitHub 组织下面,是 Google 正式推的东西。以前社区也有类似的工具,比如 BrowserTools MCP,但那是第三方做的。现在官方亲自下场,把 DevTools 的完整能力通过 MCP 协议开放出来,信号很明确:浏览器调试这件事,Google 希望 AI agent 能原生参与进来。
这个仓库已经上了 GitHub trending。如果你平时用 AI 写前端,或者经常要调试页面问题,值得去看一眼。
传送门:github.com/ChromeDevTools/chrome-devtools-mcp
#科技先锋官##How I AI#
