MCP Catalogs
首页

chrome-devtools-mcp vs next-devtools-mcp

并排对比,帮你在这两个 MCP server 之间做选择。

chrome-devtools-mcp
by ChromeDevTools
next-devtools-mcp
by vercel
Stars★ 39,757★ 747
30天用量
综合分6554
官方
分类
浏览器自动化开发者工具网页抓取
开发者工具浏览器自动化AI / LLM 工具
实现语言TypeScriptTypeScript
最近提交本月2 个月前

chrome-devtools-mcp · 概述

Chrome DevTools MCP 服务器让 AI 编码代理通过 MCP 协议控制和检查实时 Chrome 浏览器。

next-devtools-mcp · 概述

Next.js DevTools MCP 服务器,为 Next.js 应用程序提供开发工具和实用程序。

chrome-devtools-mcp · 使用场景

  • AI 代理自动执行网页测试和验证
  • Web 应用性能分析和优化
  • 通过 AI 驱动的检查调试 Web 应用程序

next-devtools-mcp · 使用场景

  • 诊断 Next.js 应用程序中的运行时错误和问题
  • 使用 Playwright 自动化测试 Next.js 应用程序
  • 搜索和检索官方 Next.js 文档和指南
  • 升级和迁移 Next.js 应用程序到新版本

chrome-devtools-mcp · 安装

安装

将以下配置添加到您的 MCP 客户端:

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

对于无头模式下的基本浏览器任务:

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

next-devtools-mcp · 安装

安装

使用 add-mcp CLI:

npx add-mcp next-devtools-mcp@latest

手动安装:

{
  "mcpServers": {
    "next-devtools": {
      "command": "npx",
      "args": ["-y", "next-devtools-mcp@latest"]
    }
  }
}
对比内容由 README + GitHub 公开数据自动生成,定期更新。