chrome
连接Chrome DevTools与AI，实现代码调试与监控的自动化集成。
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：chrome。 它的用途是：连接Chrome DevTools与AI，实现代码调试与监控的自动化集成。 完整的 Skill 内容见：https://321skill.com/skills/chrome-chrome-mcp-server-2/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
“帮我检查当前页面中ID为‘submit-btn’的按钮的CSS盒模型和事件监听器。” 它会通过本Skill连接你的Chrome，获取该元素的详细计算样式和绑定的事件，并以清晰的结构化信息反馈给你。或者，你可以说：“监控接下来5秒内所有的XHR网络请求，并列出慢于500ms的请求。” AI便会启动网络监控，并在完成后提供一份分析报告。
介绍
这个Skill解决的核心问题是开发者在调试复杂前端应用时，需要频繁在浏览器DevTools和AI助手（如Cursor）之间切换，导致调试流程割裂、效率低下的痛点。它通过一个Node.js服务器，将Chrome DevTools Protocol的能力暴露给AI，让AI可以直接读取页面信息、执行调试命令，实现调试过程的自动化与智能化。
使用方式是通过安装并运行该服务器，然后在Cursor等支持MCP协议的AI工具中配置连接。开发者可以直接向AI描述调试需求（如“检查某个元素的样式”或“监控网络请求”），AI便能通过该服务器与正在运行的Chrome实例交互，执行操作并返回结果，形成一个闭环的调试工作流。
它非常适合需要深度调试前端页面、监控运行时性能或自动化测试验证的开发人员。特别是那些在开发复杂SPA应用、进行性能优化或排查难以复现的线上Bug时，希望借助AI提升调试效率的工程师。
使用建议是，确保你的Chrome浏览器以远程调试模式启动，并注意服务器与AI工具的网络连通性。由于涉及对浏览器的深度控制，建议在开发或测试环境中使用，并注意相关页面的安全性与隐私性。
核心特点
与同类仅提供代码片段或静态分析的Skill不同，它直接打通了AI与浏览器运行时环境的桥梁，使AI能够动态执行调试指令并获取实时反馈。其核心在于将Chrome DevTools Protocol封装为AI可调用的工具，实现了真正意义上的交互式、上下文感知的智能调试。
注意事项
不适合用于生产环境下的用户浏览器监控，主要定位为开发调试辅助工具。
常见问题
这个Skill能用来做什么？
可以让AI帮你自动检查页面元素、监控网络请求、执行JavaScript代码、捕获控制台日志等，实现智能化的前端调试。
需要什么前置条件？
需要Node.js环境、一个以远程调试模式启动的Chrome/Chromium浏览器，以及支持MCP协议的AI客户端（如Cursor）。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/chrome-chrome-mcp-server-2/raw/index.md 读取 chrome 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/chrome-chrome-mcp-server-2/raw/index.md（查看排版版本）