Chrome DevTools在Agent编程工具上的安装

1.Cursor上安装

vscode打开Agent Settings

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

claude code和codex

在CLI中

Claude Code

claude mcp add chrome-devtools npx chrome-devtools-mcp@latest

Codex

codex mcp add chrome-devtools -- npx chrome-devtools-mcp@latest

Gemini

gemini mcp add chrome-devtools npx chrome-devtools-mcp@latest

Gemini限流中

Figma就是前端设计的一个工具 会把图片内CSS 什么的样式设计好

让chrome devetools进行网页自动化