blueif16/ui-clone/start-mcp

Claude Code and agent skill by blueif16/ui-clone

Trust tier 3
  • community
Source check pending

Checking that the SKILL.md file is still in the repository.

启动Chrome DevTools mcp服务器并加载到Claude Code

Install

npx vskill@latest install blueif16/ui-clone/start-mcp

SKILL.md

The same SKILL.md was published earlier as majiayu000/claude-skill-registry/start-mcp.

启动Chrome DevTools MCP服务器

当用户调用此skill时，自动执行以下操作：

  1. 检测当前项目目录
  2. 运行 npm run setup-mcp 自动设置环境变量和构建项目
  3. 验证MCP服务器是否成功添加

执行步骤

首先检查MCP服务器是否已经可用：

bash
claude mcp list

如果chrome-devtools已经连接并可用，则直接结束，不执行任何操作。

如果chrome-devtools不可用或未安装，尝试直接添加MCP服务器：

bash
claude mcp remove chrome-devtools 2>/dev/null || true
claude mcp add chrome-devtools node "$CHROME_DEVTOOLS_MCP_PATH/build/src/index.js"

然后验证是否成功：

bash
claude mcp list

如果添加成功并且chrome-devtools已连接，则结束。

如果添加失败（例如build目录不存在），则运行完整的setup脚本：

bash
npm run setup-mcp

如果setup失败，手动执行

如果自动设置失败，执行以下命令：

bash
# 1. 构建项目
npm run build
 
# 2. 移除旧的MCP服务器（如果存在）
claude mcp remove chrome-devtools 2>/dev/null || true
 
# 3. 添加新的MCP服务器
claude mcp add chrome-devtools node "$CHROME_DEVTOOLS_MCP_PATH/build/src/index.js"
 
# 4. 验证
claude mcp list

测试MCP服务器

使用MCP Inspector进行测试：

bashsta
npx @modelcontextprotocol/inspector node build/src/index.js

可用功能

加载后，你可以使用26个浏览器自动化工具，包括：

  • 页面导航和管理
  • 表单填写和点击操作
  • 网络请求监控
  • 性能分析
  • 页面截图和快照
  • JavaScript执行

常见问题

Q: 如何知道MCP服务器是否正常运行？ A: 在Claude Code中，MCP工具会自动出现在可用工具列表中。

Q: 修改代码后需要重启吗？ A: 是的，需要重新构建并重新添加MCP服务器。

Q: 如何查看MCP服务器日志？ A: 使用 npm run start-debug 启动服务器查看详细日志。

Security

  • Security scanPassed, 90 of 100Pattern checks on the skill's files.
  • Model reviewPassed

See the full security report

Quality evaluation

  • Task evaluationNot runNo evaluation yet. Run one in Skill Studio.

See evaluation results

Source

Popularity

7-day trend score
0

Not refreshed yet.

Works with

Any agent vskill installs to: 56 targets in all. These 39 have a page on this site.

  • Claude Code
  • Cursor
  • GitHub Copilot
  • Windsurf
  • Codex
  • Gemini CLI
  • Cline
  • Amp
  • Roo Code
  • Goose
  • Continue
  • Kilo Code
  • Junie
  • Trae
  • OpenHands
  • Qwen Code
  • AI Agent
  • Tabnine Chat
  • Sourcegraph Cody
  • Amazon Q
  • Firebase Genkit
  • Sweep
  • Devin
  • Phind
  • Mentat
  • Claude Desktop
  • Aider
  • GPT Pilot
  • Plandex
  • bolt.new
  • v0
  • Replit Agent
  • Anse
  • TypingMind
  • BetterChatGPT
  • LibreChat
  • Warp AI
  • Pieces
  • Fig AI
Embed badge
vskill VERIFIED badge
[![vskill VERIFIED](https://verified-skill.com/api/v1/skills/blueif16/ui-clone/start-mcp/badge)](https://verified-skill.com/skills/blueif16/ui-clone/start-mcp)

Something wrong with this skill or its page? Tell us.