在 Zed 中接入 daisyUI Blueprint MCP官方 MCP 服务器安装与配置指南【免费下载链接】daisyui The most popular, free and open-source Tailwind CSS component library项目地址: https://gitcode.com/GitHub_Trending/da/daisyui本文基于仓库文档packages/docs/src/routes/(routes)/blueprint/zed/page.md编写面向 Zed 编辑器用户讲解如何把 daisyUI 官方 MCP 服务器 daisyUI Blueprint 接入 Zed 的 Agent 上下文使 AI 能基于经过审核、实时同步的 daisyUI 资源生成组件代码。读完本文你将掌握从获取 License 到在 Zed 中添加 context server、配置许可证环境变量、触发 AI 使用 Blueprint 的完整操作链路并了解其底层运行机制与后续扩展如 Figma API 接入步骤。背景为什么 Zed 需要一套 daisyUI 专用 MCPZed 内置的 Agent 模式通过MCPModel Context Protocol与外部数据源通信把 MCP 服务器加入 Zed 的 context server 列表后AI 即可在生成答案时调用服务器提供的规则、组件结构与代码片段从而产出更准确的代码。daisyUI 的 AI 编码资源分为三类官方 MCP 服务器 daisyUI Blueprint、免费的第三方 Context7 MCP、daisyUI GitMCP。其中Blueprint 是 daisyUI 官方 MCP 服务器本仓库的packages/docs/src/routes/(routes)/blueprint/zed/page.md即为它在 Zed 中的专属安装指南仓库根目录下的packages/blueprint/mcp.json提供了等价的通用 MCP 配置模板。关于 Blueprint 为什么能提升生成质量仓库文档packages/docs/src/routes/(routes)/blueprint/workflow/page.md说明它把工作流拆分为 Setup Expert、Rules Enforcer、Creative Director、Page Architect、Component Syntax Expert、Quality Inspector 六个环节分步向 LLM 提供规则与资源并在最后做质量检查。Zed 用户接入的正是这套工作流。Step 1获取 Blueprint License KeyBlueprint 需要授权才能激活。安装前请先获取一个Blueprint license key许可证密钥购买与激活流程对应的文档入口为/blueprint/checkout/该跳转路由实现在仓库packages/docs/src/routes/(redirects)/blueprint/checkout/目录下最终导向官方支付与发码流程。支付完成后密钥会以邮件形式送达若无收到请检查垃圾邮件文件夹。随后进入配置环节。Step 2在 Zed 中添加 MCP Context Server2.1 打开命令面板在 Zed 中按下macOS⌘ CMD ⇧ Shift PWindows / LinuxCtrl Shift P2.2 执行添加命令在命令面板中键入并选择agent: add context serverZed 会引导你输入一个符合 MCP 规范的服务器配置 JSON。2.3 粘贴 Blueprint 配置将下面的配置粘贴进去并把其中的环境变量替换为你自己的值{ daisyui-blueprint: { command: npx, args: [-y, daisyui-blueprintlatest], env: { LICENSE: YOUR BLUEPRINT LICENSE KEY, EMAIL: YOUR EMAIL ADDRESS, FIGMA: YOUR FIGMA API KEY (optional) } } }字段取值说明commandnpx通过 npm 自带的 npx 启动服务器无需全局安装args[-y, daisyui-blueprintlatest]-y自动确认依赖安装latest保证每次启动拉取最新发布版与 daisyUI 版本保持同步更新env.LICENSE你的 Blueprint 许可证密钥必填用于激活服务器env.EMAIL购买时使用的邮箱地址必填与许可证绑定env.FIGMAFigma Personal Access Token可选仅在需要把 Figma 设计稿转换为 daisyUI 代码时填写这套 JSON 与仓库自带的通用模板完全一致——仓库根目录的packages/blueprint/mcp.json就是同一份daisyui-blueprint服务器声明只是占位符形式略有不同如YOUR_LICENSE_KEY可作为其他支持 MCP 配置文件的编辑器 / CLI 工具的参考基线。关于 FIGMA 变量的用途文档packages/docs/src/routes/(routes)/blueprint/figma/page.md说明它是可选的、仅在执行 Figma 转 daisyUI 代码时需要。若你暂不需要该能力可以省略这一行服务器仍可正常完成组件与主题相关的查询。2.4 启动原理说明配置保存后Zed 会按command args拉起进程。从配置可以看出Blueprints 并没有被安装到本地依赖里而是每次用npx -y daisyui-blueprintlatest按需执行npx会临时下载并运行daisyui-blueprint包的最新版-y跳过交互式安装确认进程以 MCP stdio 协议与 Zed 的 Agent 通信。Step 3让 AI 使用 Blueprint MCP服务器配置完成后还需要在提示词中明确要求 AI 调用它。原文档给出的操作是After configuring the server, tell the AI model to use Blueprint MCP.也就是在提问末尾追加use Blueprint MCP。仓库另一份 Zed 文档packages/docs/src/routes/(routes)/docs/mcp/zed/page.md提供了具体示例give me a light daisyUI 5 theme with tropical color palette. use Blueprint MCP推荐做法是在一条消息中同时给出目标描述与指令开关例如中文场景可以这样组织请基于 daisyUI 5 设计一个深色模式的数据看板布局包含卡片、统计、表格组件。 use Blueprint MCP只有当 prompt 中出现该指令时Agent 才会把 Blueprint 的 context server 作为工具与数据来源纳入调用链路因此在正式使用前务必保留并验证这一步。验证与后续步骤完成上述三步后即可在 Zed 的 Agent 面板中提问并观察工具调用输出。若服务器启动失败优先排查三点LICENSE与EMAIL是否与购买记录完全一致、是否把占位符原样保留未替换、本机npx命令是否可用。由于 Blueprint 每次都以latest启动其工具、资源与 prompt 会随 daisyUI 版本自动更新无需手动升级服务器本身。若你想启用「把 Figma 选区链接转换成 daisyUI 代码」的能力接下来的操作是获取具备只读权限的 Figma Personal Access Token填入FIGMA变量再在 Zed 中请求 AI 解析设计链接详细步骤见仓库文档packages/docs/src/routes/(routes)/blueprint/figma/page.md。延伸阅读仓库内相关文档原版安装指南packages/docs/src/routes/(routes)/blueprint/zed/page.mdBlueprint 完整工作流与六个工具角色packages/docs/src/routes/(routes)/blueprint/workflow/page.mdFigma API 配置指南packages/docs/src/routes/(routes)/blueprint/figma/page.mdZed 下三类 MCP 方案对比Blueprint / Context7 / GitMCPpackages/docs/src/routes/(routes)/docs/mcp/zed/page.md通用 MCP 配置模板packages/blueprint/mcp.json【免费下载链接】daisyui The most popular, free and open-source Tailwind CSS component library项目地址: https://gitcode.com/GitHub_Trending/da/daisyui创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考