shadcn-ui MCP 服务器

shadcn/ui 组件参考的 MCP 服务器

这是一个基于 TypeScript 的 MCP 服务器，提供 shadcn/ui 组件的参考信息。它实现了一个模型上下文协议 (MCP) 服务器，帮助 AI 助手访问 shadcn/ui 组件的文档和示例。

特性

工具

• list_shadcn_components - 获取所有可用的 shadcn/ui 组件列表
• get_component_details - 获取关于特定组件的详细信息
• get_component_examples - 获取特定组件的使用示例
• search_components - 通过关键字搜索组件

功能

此服务器抓取并缓存来自以下站点的信息：

• 官方 shadcn/ui 文档站点 (https://ui.shadcn.com)
• shadcn/ui GitHub 仓库

它提供结构化数据，包括：

• 组件描述
• 安装说明
• 使用示例
• 属性和变体
• 代码示例

开发

安装依赖：

npm install

构建服务器：

npm run build

用于自动重建的开发：

npm run watch

安装

要与 Claude Desktop 一起使用，请添加服务器配置：

在 MacOS 上：~/Library/Application Support/Claude/claude_desktop_config.json 在 Windows 上：%APPDATA%/Claude/claude_desktop_config.json

{
  "mcpServers": {
    "shadcn-ui-server": {
      "command": "/path/to/shadcn-ui-server/build/index.js"
    }
  }
}

调试

由于 MCP 服务器通过 stdio 进行通信，因此调试可能具有挑战性。我们建议使用 MCP Inspector，它作为一个包脚本提供：

npm run inspector

Inspector 将提供一个 URL 以在您的浏览器中访问调试工具。