Chrome DevTools MCP 可接入 AI IDE

是什么

视频介绍 Chrome DevTools MCP：将 Chrome 开发者工具以 MCP 服务器形式提供给支持 MCP 的 AI 编程客户端，并通过 npx chrome-devtools-mcp@latest 本地运行。

关键内容

演示先让 Cursor 检查 web.dev 的 LCP，调用页面导航、性能追踪与分析工具；随后在 ChatOllama 项目中，让 AI 修改模型选择界面并借助浏览器工具验证结果。OCR 还显示其定位包括实时验证代码、诊断网络与控制台错误、模拟用户行为、调试样式布局和自动化性能审计。

可借鉴之处

重点不只是让 AI 生成代码，而是把浏览器运行结果纳入工具调用闭环：修改后可导航、检查和分析，减少“代码看似合理但页面未验证”的风险。

边界与风险

内容是作者演示，工具数量、兼容客户端和实际效果应以官方文档及本地环境为准。演示中出现浏览器实例冲突，说明并发运行与会话管理仍可能影响验证；性能建议也需结合真实指标与生产环境复核。