Skills 与 MCP
MCP 使用边界
什么时候接 MCP,什么时候只需要 Skill、教程或普通脚本。
MCP 解决什么
MCP 适合把实时工具、外部系统和可查询资源交给 Agent 使用。典型例子包括浏览器调试、设计系统文档、内部数据库、项目索引、自动化服务和远程状态查询。
什么时候需要 MCP
- 需要读取实时状态,而不是静态说明。
- 需要调用工具完成点击、截图、查询、检索或检查。
- 需要把一个服务暴露成可复用能力,供多个 Agent 使用。
- 需要减少手写命令和手工复制结果。
什么时候不需要 MCP
- 只是固定流程和注意事项,写成 Skill 更轻。
- 只是一次性任务,写在当前页面或 AGENTS.md 即可。
- 工具输出不可验证,或者权限边界不清楚。
- 项目还没有稳定流程,过早接 MCP 会增加维护成本。
决策表
| 需求 | 建议 |
|---|---|
| 只告诉 Agent 做事顺序 | 写 Skill |
| 固化项目规则 | 写 AGENTS.md 或文档页 |
| 查询实时浏览器 DOM | 接浏览器 MCP 或 Playwright |
| 查询本地/远端系统状态 | MCP、CLI 或 SSH live probe |
| 生成可展示案例 | 写 Gallery 页面 |
和视觉验收结合
前端复刻类任务优先使用真实浏览器检查。可以先用 Playwright 保存截图,再在复杂交互或 DOM 调试时接 chrome-devtools-mcp。
配置示例
MCP 配置应该最小授权。下面是远程只读文档 MCP 的形态,真实项目要替换成自己的服务名和 URL。
{
"mcp": {
"docs-reference": {
"type": "remote",
"url": "https://example.com/mcp",
"enabled": true
}
}
}
本地工具型 MCP 要额外标注权限边界:
{
"mcp": {
"browser-qa": {
"command": "npx",
"args": ["chrome-devtools-mcp"],
"readOnly": true
}
}
}
不同客户端字段名可能不同,记录时写清楚客户端、配置文件路径和 MCP 服务暴露的工具列表。
读写权限分层
| 权限 | 例子 | 使用规则 |
|---|---|---|
| 只读资源 | 文档、组件说明、数据库 schema | 可以默认启用 |
| 本地检查 | DOM、截图、日志读取 | 用于验收,避免写生产状态 |
| 本地写入 | 生成文件、修改配置 | 需要限制工作目录 |
| 远程写入 | 重启服务、改数据库、发消息 | 默认禁止,除非用户明确授权 |
权限边界
接 MCP 前要先明确它能读什么、能写什么、是否会操作真实账号或生产服务。对文档站这类本地项目,优先用只读查询和截图;涉及远程服务时先读状态,再让用户确认重启或破坏性操作。
继续阅读
按当前页面继续跳到相关教程、评测、路线或 Gallery 示例。