Now vibe coding, so learning hammer FE ?https://channel.meo-ai.comhttps://channel.meo-ai.com/posts/668https://channel.meo-ai.com/posts/668Sun, 21 Jun 2026 23:49:37 GMT<span class="post-title-source">《</span><mark class="highlight"><span class="post-title-source">MDN</span></mark><span class="post-title-source"> 推出官方 MCP 服务器，让 AI 助手实时获取权威 Web 文档》</span><br /><br />标签：<a href="/search/result?q=%23%E5%89%8D%E7%AB%AF" title="#前端">#前端</a> <a href="/search/result?q=%23AI%E5%B7%A5%E5%85%B7" title="#AI工具">#AI工具</a> <a href="/search/result?q=%23MCP" title="#MCP">#MCP</a> <a href="/search/result?q=%23MDN" title="#MDN">#MDN</a> <a href="/search/result?q=%23%E6%B5%8F%E8%A7%88%E5%99%A8%E5%85%BC%E5%AE%B9%E6%80%A7" title="#浏览器兼容性">#浏览器兼容性</a> <a href="/search/result?q=%23VSCode" title="#VSCode">#VSCode</a> <a href="/search/result?q=%23Claude" title="#Claude">#Claude</a><br /><br />总结：<br /><mark class="highlight">MDN</mark> 官方发布了一款实验性 MCP（Model Context Protocol）服务器，旨在让 LLM 和编程助手直接访问 <mark class="highlight">MDN</mark> 的搜索、文档及浏览器兼容性数据（BCD），解决 AI 回答中可能出现的过时或错误信息问题。开发者可通过远程服务或本地部署方式接入，支持 VS Code、Claude Code 等 MCP 兼容客户端，实现编码时一键查询 API 用法和兼容性，无需离开编辑器。<br /><br />文章要点：<br />1. 官方出品，权威数据源：这是 <mark class="highlight">MDN</mark> 官方推出的 MCP 服务器，直接对接 <mark class="highlight">MDN</mark> 的搜索 API、文档 JSON API 以及浏览器兼容性数据（BCD），确保 AI 获取的是最新、最准确的 Web 平台技术资料，而不是训练数据中的"旧知识"<br />2. 六大核心工具，覆盖开发全场景：提供 <code>mdn_search</code>（关键词搜索）、<code>mdn_doc</code>（获取完整文档）、<code>mdn_compat</code>（浏览器兼容性检查）、<code>mdn_list</code>（浏览 BCD 特性）、<code>mdn_css</code>（CSS 属性定义）、<code>mdn_http</code>（HTTP 参考）等工具，从查文档到看兼容性一站搞定<br />3. 远程 + 本地双模式部署：既可以一键接入官方远程服务（<code>https://mcp.mdn.mozilla.net/</code>），也可以克隆仓库本地运行，满足对数据隐私有顾虑的团队需求；本地模式支持 MCP Inspector 调试，开发体验友好<br />4. 无缝集成主流开发工具：完美支持 VS Code、Claude Code、Cursor 等 MCP 兼容客户端，配置简单，安装后直接在 AI 聊天中调用工具，真正实现"边写代码边查文档"的流畅体验<br />5. 实验性质，持续迭代中：目前处于实验阶段，Mozilla 会收集查询数据以优化服务（可 opt-out），且保留随时调整或下线服务的权利，建议开发者关注官方动态<br /><br />URL：<br /><a href="https://developer.mozilla.org/en-US/blog/introducing-mdn-mcp-server/" target="_blank" rel="noopener" title="https://developer.mozilla.org/en-US/blog/introducing-mdn-mcp-server/">https://developer.mozilla.org/en-US/blog/introducing-mdn-mcp-server/</a><a class="tgme_widget_message_link_preview" href="https://mcp.mdn.mozilla.net/" target="_blank" rel="noopener" title="The MDN Web Docs site provides information about Open Web technologies including HTML, CSS, and APIs for both Web sites and progressive web apps."> <i class="link_preview_right_image" style="background-image:url('https://cdn4.telesco.pe/file/MWzDnhywnpdY2bGFk6Pchxlv8pL-h5PUzTMPT2tp_uqLWPohVX7Ad-ipYtyVH_NCSOdNtSSKSlXn6GrTd5qTNcoDXBiKR3o0dgCsFTIx7iBfefoJkCpH3tN-hGXgCWHvDNxVM1Ig1qqkvgyoWlYCsqio4ktLx9PBzJmQU9mUzJUmYGMs8PsA87_C0PGREFxp1dD_nI_vDkGBTlPEW8CiqHkYeacH3jCtMBAwbsGPug6icGDFB3-c2HJSihYZJMNuqbK0FWUVBU8kTdXL3xf6XoHhjHK0PQJ-pf2RGCVASgwD2Uhc3O79eg-LPiNXyJ3zd-ZTapXF0UIyc5NqsIAcPQ.jpg')"></i> <div class="link_preview_site_name accent_color">MDN Web Docs</div> <div class="link_preview_title"><mark class="highlight">MDN</mark> MCP server</div> <div class="link_preview_description">The <mark class="highlight">MDN</mark> Web Docs site provides information about Open Web technologies including HTML, CSS, and APIs for both Web sites and progressive web apps.</div> </a>