Servidor MCP shadcn-ui

Servidor MCP para referencias de componentes shadcn/ui

Este es un servidor MCP basado en TypeScript que proporciona información de referencia para los componentes shadcn/ui. Implementa un servidor de Protocolo de Contexto de Modelo (MCP) que ayuda a los asistentes de IA a acceder a la documentación y los ejemplos de los componentes shadcn/ui.

Características

Herramientas

list_shadcn_components : obtiene una lista de todos los componentes shadcn/ui disponibles
get_component_details : obtener información detallada sobre un componente específico
get_component_examples : obtener ejemplos de uso para un componente específico
search_components - Buscar componentes por palabra clave

Funcionalidad

Este servidor recopila y almacena en caché información de:

El sitio oficial de documentación de shadcn/ui ( https://ui.shadcn.com )
El repositorio de GitHub shadcn/ui

Proporciona datos estructurados que incluyen:

Descripciones de componentes
Instrucciones de instalación
Ejemplos de uso
Accesorios y variantes
Ejemplos de código

Desarrollo

Instalar dependencias:

npm install

Construir el servidor:

npm run build

Para desarrollo con reconstrucción automática:

npm run watch

Instalación

Configuración del escritorio de Claude

Para utilizar con Claude Desktop, agregue la configuración del servidor:

En MacOS: ~/Library/Application Support/Claude/claude_desktop_config.json En Windows: %APPDATA%/Claude/claude_desktop_config.json

Opción 1: Usar compilación local

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

Opción 2: Usar el comando npx

{
  "mcpServers": {
    "shadcn-ui-server": {
      "command": "npx",
      "args": ["-y", "shadcn-ui-mcp-server"]
    }
  }
}

Configuración de windsurf

Agregue esto a su ./codeium/windsurf/model_config.json :

{
  "mcpServers": {
    "shadcn-ui-server": {
      "command": "npx",
      "args": ["-y", "shadcn-ui-mcp-server"]
    }
  }
}

Configuración del cursor

Agregue esto a su .cursor/mcp.json :

{
  "mcpServers": {
    "shadcn-ui-server": {
      "command": "npx",
      "args": ["-y", "shadcn-ui-mcp-server"]
    }
  }
}

Depuración

Dado que los servidores MCP se comunican a través de stdio, la depuración puede ser complicada. Recomendamos usar el Inspector MCP , disponible como script de paquete:

npm run inspector

El Inspector proporcionará una URL para acceder a las herramientas de depuración en su navegador.

You must be authenticated.

security – no known vulnerabilities

license - permissive license

quality - confirmed to work

hybrid server

The server is able to function both locally and remotely, depending on the configuration or use case.

Tools

Ayuda a los asistentes de IA a acceder a la documentación y los ejemplos de componentes shadcn/ui a través de un servidor MCP basado en TypeScript que proporciona información de referencia para detalles de componentes, ejemplos de uso y capacidades de búsqueda.

Related MCP Servers

Apifox MCP
sujianqingfeng
-
security
-
license
-
quality
An MCP server that integrates Apifox API documentation with AI assistants, allowing AI to extract and understand API information from Apifox projects.
Last updated -
91
TypeScript
code2prompt-mcp
ODAncona
-
security
A
license
-
quality
An MCP server that analyzes codebases and generates contextual prompts, making it easier for AI assistants to understand and work with code repositories.
Last updated -
10
Python
MIT License
browser-use MCP Server
co-browser
-
security
A
license
-
quality
An MCP server that enables AI assistants to control a web browser through natural language commands, allowing them to navigate websites and extract information via SSE transport.
Last updated -
505
Python
MIT License
ServiceTitan MCP Server
JordanDalton
A
security
F
license
A
quality
An MCP server that allows AI assistants to interact with the ServiceTitan API, requiring client credentials for authentication.
Last updated -
454
TypeScript

View all related MCP servers

shadcn-ui MCP Server