UI组件协议服务器

一个基于TypeScript的模型上下文协议(MCP)服务器,用于帮助AI助手与finstreet/ui组件交互,支持获取组件源代码和演示代码。

  • by engelkes-finstreet
  • TypeScript
  • 本地部署
  • 更新于
在 GitHub 查看 engelkes-finstreet/context-forge-mcp

使用说明

Finstreet UI MCP服务器

模型上下文协议(MCP)服务器的TypeScript实现,旨在帮助AI助手与finstreet/ui组件进行交互。它允许AI模型获取组件故事。

使用Docker运行

先决条件

设置

  1. 创建环境文件:
cp .env.example .env
  1. 编辑 .env 文件并添加您的GitHub令牌:
# Edit the .env file and replace 'your_github_token_here' with your actual GitHub token
# The file should contain:
# GITHUB_TOKEN=your_actual_github_token

运行服务器

这 compose.yaml 使用 .env 所有环境变量的文件。

1.构建Docker镜像:

docker compose build

2.启动HTTP/SSE服务器:

docker compose up -d mcp-server-http
  • 访问权限: http://localhost:4444 上海证券交易所 /sse,消息: /messages)
  • 服务器在容器内的端口3000上运行,映射到主机上的端口4444

3.查看日志:

docker compose logs -f mcp-server-http

4.停止服务器:

docker compose down

特性

此MCP服务器提供以下功能:

工具

  1. get_component:

    • 检索指定shadcn/ui组件的源代码。
    • 参数: componentName (字符串)-例如“按钮”。
    • 返回:组件源代码。
  2. get_component_demo:

    • 获取shadcn/ui组件的演示代码。
    • 参数: componentName (字符串)。
    • 返回:演示代码。

资源

  1. resource:get_components:
    • 列出所有可用的shadcn/ui组件。

资源模板

  1. resource-template:get_install_script_for_component:

    • 为组件生成安装脚本。
    • 参数: packageManager (字符串-npm、pnpm、yarn、bun), component (字符串)。
  2. resource-template:get_installation_guide:

    • 为shadcn/ui提供特定于框架的安装指南。
    • 参数: framework (string-next、vite等), packageManager (字符串)。

额外资源