教程文档【免费下载链接】easy-vibe从 0 到 1 学会 vibe coding项目制学习项目地址https://gitcode.com/datawhalechina/easy-vibe点击查看免费下载Claude Code 是 Anthropic 官方推出的 AI 命令行工具而 MCPModel Context Protocol模型上下文协议是让 Claude Code 连接外部工具与服务的标准化协议。本指南基于 easy-vibe 项目 Stage 3 核心技能模块的 MCP 文档系统讲解 MCP 的配置位置、自然语言管理方式、三种传输模式、调试手段与最佳实践读完即可将 Claude Code 从只会读写本地文件的助手升级为能操作 GitHub、数据库、浏览器与各类云服务的超级开发助手。一、MCP 是什么Claude Code 连接外部世界的协议Claude Code是 Anthropic 官方的 AI 命令行工具MCPModel Context Protocol则是让 Claude Code 连接外部工具和服务的协议。简单来说MCP 让 Claude Code 从一个「只能读写本地文件」的 AI 助手变成一个「能访问 GitHub、数据库、API、云服务」的超级助手。从协议背景看详见 easy-vibe 附录章节 AI Agent 协议原理MCP 与 A2AMCP 由 Anthropic 于 2024 年 11 月发布采用 MIT 开源协议。其诞生背景是每个工具都要单独集成的痛点——让 AI 读取 GitHub 仓库要写集成代码查询数据库要写集成代码操作文件系统还要写集成代码每一份集成都在重复认证、错误处理、数据转换等逻辑。MCP 的核心目标是让工具开发者写一次代码所有支持 MCP 的 AI 应用都能使用。MCP 提供三大核心能力能力英文作用示例工具ToolsAI 可以调用的功能查询天气、发送邮件资源ResourcesAI 可以读取的数据文件内容、数据库记录提示Prompts预定义的提示模板代码审查模板、写作模板一个形象的类比是USB-C 接口以前每个设备都有自己的充电口圆口、扁口、磁吸口USB-C 统一了所有设备的充电与数据传输MCP 则统一了 AI 与所有工具的连接方式。工具开发者只需实现一次 MCP Server所有支持 MCP 的 AI 应用Claude、Cursor、Windsurf 等都能直接使用。二、为什么需要 MCP能力对比没有 MCP 的 Claude Code你能做的 ✓ 读取本地文件 ✓ 编辑代码 ✓ 运行命令 ✓ 使用 Bash 工具 你不能做的 ✗ 查看你的 GitHub Issues ✗ 访问云数据库 ✗ 调用外部 API ✗ 获取实时天气有了 MCP 的 Claude Code你能做的 ✓ 所有原来的功能 ✓ 查看/创建 GitHub Issues 和 PR ✓ 查询 SQLite、PostgreSQL 数据库 ✓ 访问 Notion、Slack 等外部服务 ✓ 获取实时天气、地图数据 ✓ 浏览器自动化 ✓ ...以及更多从 easy-vibe 附录的典型应用场景看MCP 覆盖四类核心用法本地文件操作读取代码库、分析日志文件、数据库查询SQL 查询、数据分析、API 调用GitHub API、Slack、邮件、开发工具集成Git 操作、终端命令。实际案例包括 Cursor/Windsurf 通过 MCP 连接文件系统与 Git、Claude Desktop 通过 MCP 连接笔记软件和邮件客户端、以及让 AI 执行备份、部署、数据同步等自动化脚本。三、快速开始4 个步骤步骤 1了解配置文件位置Claude Code 的 MCP 配置文件位于两个层级级别配置文件路径作用范围用户级~/.claude.json所有项目项目级.claude/mcp.json当前项目推荐优先使用项目级配置让不同项目使用不同的 MCP 服务。步骤 2用自然语言添加 MCP 服务器在 Claude Code 中你不需要手动编辑配置文件或记忆命令直接用自然语言描述即可你帮我添加 GitHub MCP 服务器我的 token 是 ghp_xxx Claude我来帮你配置 GitHub MCP 服务器... [自动更新 .claude/mcp.json]你添加一个 SQLite 数据库服务器数据库文件在 ./data/app.db Claude好的我来配置 SQLite MCP 服务器...你添加一个 HTTP 类型的 MCP 服务器地址是 https://api.example.com/mcp Claude我来添加这个远程 MCP 服务器...步骤 3验证配置直接向 Claude Code 提问你现在有哪些可用的 MCP 服务器 Claude当前配置的 MCP 服务器 • github - GitHub 集成 • sqlite - SQLite 数据库 • filesystem - 文件系统访问或者使用诊断命令/doctor步骤 4开始使用配置成功后直接通过自然语言调用 MCP 功能你帮我在 GitHub 上创建一个 Issue Claude我可以帮你创建 GitHub Issue请告诉我 - 仓库地址例如 owner/repo - Issue 的标题 - Issue 的描述四、用自然语言管理 MCP 服务器查看与管理服务器你可以完全通过自然语言与 Claude Code 交互你列出所有已配置的 MCP 服务器 你检查 MCP 服务器的连接状态 你删除名为 notion 的 MCP 服务器 你更新 github 服务器的 token诊断问题遇到问题时你检查 MCP 连接出了什么问题 Claude[会自动执行诊断分析配置文件检查服务器状态]五、配置方法详解1. 用户级全局配置编辑~/.claude.json{ mcpServers: { filesystem: { command: npx, args: [-y, modelcontextprotocol/server-filesystem, /Users/votrenom/Documents] }, github: { command: npx, args: [-y, modelcontextprotocol/server-github], env: { GITHUB_PERSONAL_ACCESS_TOKEN: votre-token } } } }2. 项目级配置推荐在项目根目录编辑.claude/mcp.json{ mcpServers: { project-db: { command: npx, args: [-y, modelcontextprotocol/server-sqlite, --db-path, ./data/app.db] } } }项目级配置的优势团队成员可以将配置提交到 Git 中共享不同项目可以使用不同的 MCP 服务配置更灵活不会污染全局设置3. 三种传输模式Claude Code 支持三种传输模式STDIO本地进程{ mcpServers: { local-tool: { command: npx, args: [-y, modelcontextprotocol/server-filesystem, /chemin] } } }HTTP远程服务{ mcpServers: { remote-api: { url: https://api.example.com/mcp, transport: http, headers: { Authorization: Bearer votre-token } } } }SSE服务器发送事件{ mcpServers: { streaming: { url: https://api.example.com/sse, transport: sse } } }关于配置文件的实际形态easy-vibe 仓库根目录下的 config/mcporter.json 提供了一个真实示例它通过command字段直接指向一个浏览器 Agent 的 MCP 服务器可执行文件并携带--start_url、--window_width、--window_height、--resize_width、--resize_height、--max_steps、--log_dir等启动参数同时包含一个空的imports字段用于扩展引用。可以看到无论服务器来自 npm 包还是本地可执行文件MCP 配置都遵循同一套mcpServers键值结构。六、实战示例示例 1GitHub 工作流自动化你帮我把当前修改推送到 GitHub并创建标题为「Add new feature」的 PR Claude 1. 检查当前 git 状态... 2. 创建新分支 feature/new-feature... 3. 提交修改... 4. 推送到远程... 5. 调用 github_create_pull_request 创建 PR... 6. PR 已创建https://github.com/owner/repo/pull/123示例 2数据库查询你查询数据库中最近注册的 10 个用户 Claude 1. 连接 SQLite 数据库... 2. 执行查询SELECT * FROM users ORDER BY created_at DESC LIMIT 10 3. 返回结果 - 张三 (zhangexample.com) - 2025-02-28 - 李四 (liexample.com) - 2025-02-27 ...示例 3网页截图与设计分析你打开 https://example.com截图并分析页面设计 Claude 1. 启动浏览器... 2. 导航到 https://example.com... 3. 截图... 4. [返回截图] 5. 分析页面设计 - 布局采用居中设计最大宽度 1200px - 主色调为蓝色 (#3b82f6) - 导航栏固定在顶部 ...示例 4Notion 集成你把我刚写的笔记保存到 Notion Claude 1. 使用 Notion MCP 服务器... 2. 创建新页面... 3. 已保存https://notion.so/page/xxx七、调试技巧用自然语言诊断当出现问题直接告诉 Claude Code你我的 MCP 服务器连接不上请帮我检查 你GitHub MCP 工具调用失败了是什么原因 你为什么 sqlite 服务器一直显示「connecting」Claude Code 会自动执行检查配置文件格式校验环境变量测试服务器连接给出具体的修正建议常见问题排查表问题可能原因解决方案服务器未连接配置文件格式错误检查 JSON 语法工具无法调用权限不足检查环境变量连接超时网络问题检查 URL 或网络进程崩溃服务器代码 bug查看服务器日志手动诊断命令/doctor示例输出系统诊断报告 Claude Codev2.5.0 ✓ Node.jsv20.0.0 ✓ MCP 服务器状态 • github✓ 已连接12 个工具 • sqlite✗ 连接失败 - 找不到数据库文件 • puppeteer✓ 已连接8 个工具 建议 1. 检查 sqlite 数据库路径是否正确 2. 确保 .claude/mcp.json 格式正确八、最佳实践1. 优先使用项目级配置不同项目往往需要不同的 MCP 服务前端项目可能需要浏览器测试工具后端项目可能需要数据库连接。使用项目级配置每个项目可以拥有自己专属的 MCP 服务器集合避免全局大配置的混乱。更重要的是项目级配置可以提交到 Git。团队克隆项目后成员可以直接使用相同的 MCP 服务无需重新配置项目 A前端项目- .claude/mcp.json 中包含浏览器测试 MCP 项目 B后端项目- .claude/mcp.json 中包含数据库 MCP2. 敏感信息存放在环境变量中切勿在配置文件中硬编码密钥。配置文件可能被意外提交到 Git 并泄露密钥。正确做法是把敏感值存放到环境变量中配置文件中只引用变量名。这样即使配置文件公开真实密钥依然隐藏。{ env: { GITHUB_TOKEN: $GITHUB_TOKEN, GITHUB_TOKEN: ghp_abc123 } }第一种写法是好的从环境变量读取第二种写法是坏的直接硬编码了密钥。3. 锁定版本默认情况下npx -y总是使用 MCP 服务器的最新版本这可能带来问题新版本可能引入破坏性变更或者包被突然删除/改名。在包名后添加版本号确保始终使用已验证的版本减少自动更新带来的意外{ command: npx, args: [-y, modelcontextprotocol/server-github1.2.3] }4. 记录 MCP 配置当一个项目包含多个 MCP 服务器时新成员可能不清楚每个服务器的用途和所需配置。在.claude/目录下创建README.md说明每个服务器的用途、所需配置以及如何获取凭证可以显著降低沟通成本。在项目中创建.claude/README.md# MCP 配置说明 本项目使用的 MCP 服务器 ## github 用于 GitHub 自动化。需要 GITHUB_TOKEN。 ## sqlite 连接 ./data/app.db 进行数据查询和修改。 ## puppeteer 用于 E2E 测试。九、Claude Code vs Claude Desktop功能Claude CodeClaude Desktop配置文件~/.claude.json或.claude/mcp.jsonclaude_desktop_config.json项目级配置✓ 支持✗ 不支持自然语言管理✓ 支持✗ 需手动编辑诊断功能✓/doctor✗ 无热重载✓ 自动✗ 需重启应用使用场景开发工作流、CI/CD日常使用、桌面任务十、常用 MCP 服务器配置完整 MCP 服务器清单可参考 easy-vibe 附录章节AI Agent 协议原理MCP 与 A2AGitHub 服务器功能Issues、PR、仓库管理{ mcpServers: { github: { command: npx, args: [-y, modelcontextprotocol/server-github], env: { GITHUB_PERSONAL_ACCESS_TOKEN: votre-token } } } }SQLite 服务器功能查询和管理 SQLite 数据库{ mcpServers: { sqlite: { command: npx, args: [-y, modelcontextprotocol/server-sqlite, --db-path, ./data/database.db] } } }Filesystem 服务器功能访问指定目录中的文件{ mcpServers: { filesystem: { command: npx, args: [-y, modelcontextprotocol/server-filesystem, /Users/votrenom/Documents] } } }Puppeteer 浏览器自动化功能浏览器控制、截图、自动化测试{ mcpServers: { puppeteer: { command: npx, args: [-y, modelcontextprotocol/server-puppeteer] } } }Brave 搜索服务器功能网络搜索{ mcpServers: { brave-search: { command: npx, args: [-y, modelcontextprotocol/server-brave-search], env: { BRAVE_API_KEY: votre-cle-api-brave } } } }十一、在 easy-vibe 中继续深入本指南对应 easy-vibe Stage 3 核心技能core-skills模块中的 MCP 章节。想要从协议原理层面理解 MCP可以继续阅读附录章节 AI Agent 协议原理MCP 与 A2A涵盖 MCP 的发布背景、三大核心能力Tools/Resources/Prompts、USB-C 类比、典型应用场景以及与 Google A2AAgent-to-Agent Protocol的对比与互补关系本模块其他核心技能章节如 agent-teams、github-iterative-development、long-running-tasks可以帮助你在掌握 MCP 之后进一步构建完整的 AI 辅助开发工作流。赞分享教程文档【免费下载链接】easy-vibe从 0 到 1 学会 vibe coding项目制学习项目地址https://gitcode.com/datawhalechina/easy-vibe点击查看免费下载相关推荐easy-vibe 教程Claude Code MCP 完整配置实战指南easy vibe 教程Claude Code MCP 完整配置实战指南 MCPModel Context Protocol是当前 AI 编程工具链中的关教程文档人工智能Vibe CodingClaude Code MCP 完全指南从协议原理到生产级配置实战easy-vibe 项目实践Claude Code MCP 完全指南从协议原理到生产级配置实战easy vibe 项目实践 本文以 easy vibe 开源仓库中 MCP 与 Cla教程文档easy-vibe 实战Claude Code Agent Teams 多智能体协作完全指南easy vibe 实战Claude Code Agent Teams 多智能体协作完全指南 导读 本文围绕 Datawhale easy vibe 课程教程文档上一篇QEMU 可组合 SR-IOV 设备Composable SR-IOV完整指南基于 virtio-net-pci 的 PF/VF 组建与配置下一篇Consul性能剖析CPU、内存、网络资源使用分析终极指南创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考