MasterGo Magic MCP

Un servicio MCP independiente que conecta las herramientas de diseño de MasterGo con modelos de IA, permitiéndoles recuperar datos DSL directamente desde archivos de diseño.

GitHub

286

Prueba este MCPPatrocinado

Documentación

MasterGo Magic MCP

MasterGo Magic MCP es un servicio MCP (Model Context Protocol) independiente diseñado para conectar las herramientas de diseño de MasterGo con modelos de IA. Permite que los modelos de IA recuperen directamente datos DSL de los archivos de diseño de MasterGo.

Características principales

Recupera datos DSL de archivos de diseño de MasterGo
Se ejecuta directamente con npx
No requiere dependencias externas, solo necesita el entorno Node.js

Tutorial

https://mastergo.com/file/192644601973042

Ejemplos de prompts

Una vez que el servidor MCP esté conectado, puedes usar los siguientes prompts en tu chat de IA:

Extraer SVG y previsualizarlo en HTML:

Extract SVG and preview in HTML: https://{domain}/file/{fileId}?layer_id={layerId}

Restaurar un diseño a código:

Restore design: https://{domain}/file/{fileId}?layer_id={layerId}

Reemplaza {domain}, {fileId} y {layerId} con tus valores reales. También puedes usar enlaces cortos:

Restore design: https://{domain}/goto/{shortLink}

Restaurar un diseño y guardarlo como archivo HTML:

Restore design, save as HTML file: https://{domain}/file/{fileId}?layer_id={layerId}

También puedes usar enlaces cortos:

Restore design, save as HTML file: https://{domain}/goto/{shortLink}

Uso

Obtención de MG_MCP_TOKEN

Visita https://mastergo.com
Entra en la configuración personal
Haz clic en la pestaña Configuración de seguridad
Busca el token de acceso personal
Haz clic para generar el token

Requisitos de permisos

Importante: Si la herramienta está conectada pero devuelve un error de "sin permisos", comprueba las siguientes condiciones:

Requisito de versión de la cuenta:
- Se requiere una cuenta de MasterGo de Edición de equipo o superior
- La edición gratuita personal no admite el acceso a herramientas MCP
Requisito de ubicación del archivo:
- Los archivos de diseño deben estar ubicados en Proyectos de equipo
- Los archivos del borrador no se pueden acceder mediante herramientas MCP

Opciones de línea de comandos

npx @mastergo/magic-mcp --token=YOUR_TOKEN [--url=API_URL] [--rule=RULE_NAME] [--proxy=PROXY_URL] [--format=FORMAT] [--header "Key: Value"] [--debug] [--no-rule] [--no-prefix]

Parámetros:

--token=YOUR_TOKEN (obligatorio): Token de API de MasterGo para autenticación
--url=API_URL (opcional): URL base de la API, por defecto http://localhost:3000
--rule=RULE_NAME (opcional): Añade reglas de diseño a aplicar, se puede usar varias veces
--proxy=PROXY_URL (opcional): URL de proxy HTTP/HTTPS (p. ej., http://127.0.0.1:7890), también admite las variables de entorno HTTPS_PROXY / HTTP_PROXY
--header "Key: Value" (opcional): Cabecera HTTP personalizada, se puede usar varias veces. Entrecomilla el valor cuando contenga espacios. Las cabeceras personalizadas anulan los valores predeterminados, incluidos Content-Type y el token de autenticación, así que coincide exactamente con la clave predeterminada al anularla. También se puede configurar mediante la variable de entorno MG_EXTRA_HEADERS como objeto JSON (p. ej., MG_EXTRA_HEADERS='{"X-Custom":"val"}'); las cabeceras de CLI tienen prioridad sobre las de entorno.
--format=FORMAT (opcional): Formato de salida predeterminado para las herramientas de datos de diseño: uno de json (predeterminado), yaml, tree. Un parámetro de herramienta format explícito por llamada anula este valor. También se puede configurar mediante la variable de entorno DEFAULT_FORMAT.
--debug (opcional): Activa el modo de depuración para obtener información detallada de errores
--no-rule (opcional): Desactiva las reglas predeterminadas
--no-prefix (opcional): Registra herramientas sin el prefijo de nombre mcp__ (p. ej., getDsl en lugar de mcp__getDsl). Algunos clientes MCP (como Grok Build) omiten silenciosamente las herramientas cuyo nombre server__tool totalmente calificado contiene más de un separador __; dado que el servidor ya tiene el prefijo, un nombre de herramienta mcp__getDsl se convierte en server__mcp__getDsl y se descarta. Activa esta opción para esos clientes. También se puede configurar mediante la variable de entorno MG_NO_PREFIX (1/true/yes).

También puedes usar el formato separado por espacios para los parámetros:

npx @mastergo/magic-mcp --token YOUR_TOKEN --url API_URL --rule RULE_NAME --proxy PROXY_URL --format FORMAT --header "Key: Value" --debug

Variables de entorno

Alternativamente, puedes usar variables de entorno en lugar de argumentos de línea de comandos:

MG_MCP_TOKEN o MASTERGO_API_TOKEN: Token de API de MasterGo
API_BASE_URL: URL base de la API
RULES: Matriz JSON de reglas (p. ej., '["rule1", "rule2"]')
DEFAULT_FORMAT: Formato de salida predeterminado para las herramientas de datos de diseño (json | yaml | tree); el argumento --format y un parámetro de herramienta format explícito por llamada tienen prioridad.
MG_NO_PREFIX: Establécelo en 1/true/yes para registrar herramientas sin el prefijo de nombre mcp__ (el argumento --no-prefix tiene prioridad).
HTTPS_PROXY / https_proxy / HTTP_PROXY / http_proxy: URL de proxy HTTP(S) (el argumento --proxy tiene prioridad)

Formato de salida de las herramientas

Las herramientas de datos de diseño (mcp__getDesignSections, mcp__getDsl, mcp__getDesignSvgs, mcp__getDesignTexts, mcp__extractSvg, mcp__getMeta) aceptan un parámetro opcional format que controla cómo se serializa la carga útil. Su valor predeterminado es json, o el valor establecido mediante --format / DEFAULT_FORMAT (consulta Opciones de línea de comandos).

Valor	Descripción
`json`	Predeterminado. JSON compacto: útil para canalizar la salida hacia herramientas que esperan JSON. Byte-idéntico al comportamiento anterior.
`yaml`	Menos tokens que JSON para diseños típicos (los diseños planos con valores repetidos se benefician más).
`tree`	Formato compacto experimental. Las claves estructurales (`id`, `name`, `type`) se codifican posicionalmente en cada línea de nodo, y los valores de estilo permanecen deduplicados en un bloque `globalVars`. Los diseños con gran reutilización de estilos obtienen el mayor ahorro de tokens.

El formato se elige por llamada de herramienta mediante el modelo de IA. Para influir en ello, menciona el formato deseado en tu prompt, por ejemplo:

Restore design, use tree format: https://{domain}/file/{fileId}?layer_id={layerId}

Notas:

tree se aplica a las respuestas de las seis herramientas: mcp__getDesignSections (lista de secciones y DSL por sección), mcp__getDsl, mcp__getDesignSvgs, mcp__getDesignTexts, mcp__extractSvg y mcp__getMeta. mcp__getMeta recurre a JSON bajo tree porque su campo rules es markdown (el diseño de árbol corrompería los encabezados/bloques de código del markdown); otras cargas útiles se representan como árbol. Las formas realmente desconocidas también recurren a JSON: nunca se formatea mal ningún dato.
Para mcp__getDesignTexts, se recomienda json para obtener la máxima fidelidad de texto verbatim, aunque todos los formatos hacen round-trip sin pérdida de datos.
Todos los formatos hacen round-trip sin pérdida de datos. Un valor format no válido u omitido recurre a json.

Instalación mediante Smithery Marketplace

Smithery es un marketplace de servidores MCP que facilita la instalación y gestión de servicios MCP.

Método 1: Instalación mediante el sitio web de Smithery

Visita Smithery Marketplace
Haz clic en el botón "Connect" o "Install"
Selecciona tu cliente MCP (p. ej., Claude Desktop, Cursor, etc.)
Sigue las instrucciones para completar la instalación y configuración

Uso con LINGMA

Busca LINGMA en el marketplace de extensiones de VSCode e instálalo.

Después de iniciar sesión, haz clic en [herramientas MCP] en el cuadro de chat.

Haz clic en [MCP Square] en la parte superior para entrar en el marketplace de MCP, busca la herramienta de colaboración de diseño de MasterGo e instálala.

Después de la instalación, vuelve a [MCP Servers] y edita nuestro servicio MCP para reemplazarlo con tu propio token de MasterGo.

Finalmente, cambia el modo de chat al modo agente en la interfaz de chat.

Uso con cursor

Guía de uso de Cursor Mcp de referencia: https://docs.cursor.com/context/model-context-protocol#using-mcp-tools-in-agent

Puedes configurar el servidor MCP usando argumentos de línea de comandos o variables de entorno:

Opción 1: Usando argumentos de línea de comandos

{
  "mcpServers": {
    "mastergo-magic-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "@mastergo/magic-mcp",
        "--token=<YOUR_TOKEN>",
        "--url=https://mastergo.com"
      ],
      "env": {}
    }
  }
}

Opción 2: Usando variables de entorno

{
  "mcpServers": {
    "mastergo-magic-mcp": {
      "command": "npx",
      "args": ["-y", "@mastergo/magic-mcp"],
      "env": {
        "MG_MCP_TOKEN": "<YOUR_TOKEN>",
        "API_BASE_URL": "https://mastergo.com"
      }
    }
  }
}

Opción 3: Usando SSE (HTTP transmisible)

No se requiere instalación local. El servidor MCP se ejecuta de forma remota y se accede mediante SSE:

{
  "mcpServers": {
    "mastergo-magic-mcp": {
      "type": "http",
      "url": "https://mastergo.com/mcp/xf/sse",
      "headers": {
        "x-mg-useraccesstoken": "<YOUR_TOKEN>"
      }
    }
  }
}

Uso con cline

Opción 1: Usando argumentos de línea de comandos

{
  "mcpServers": {
    "@master/mastergo-magic-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "@mastergo/magic-mcp",
        "--token=<YOUR_TOKEN>",
        "--url=https://mastergo.com"
      ],
      "env": {}
    }
  }
}

Opción 2: Usando variables de entorno

{
  "mcpServers": {
    "@master/mastergo-magic-mcp": {
      "command": "npx",
      "args": ["-y", "@mastergo/magic-mcp"],
      "env": {
        "MG_MCP_TOKEN": "<YOUR_TOKEN>",
        "API_BASE_URL": "https://mastergo.com"
      }
    }
  }
}

Uso con Open Code

Open Code usa un bloque de configuración mcp con la matriz type: "local" y command:

{
  "mcp": {
    "mastergo-magic-mcp": {
      "type": "local",
      "command": [
        "npx",
        "-y",
        "@mastergo/magic-mcp",
        "--token=<YOUR_TOKEN>",
        "--url=https://mastergo.com"
      ],
      "environment": {
        "NPM_CONFIG_REGISTRY": "https://registry.npmjs.org/"
      },
      "enabled": true
    }
  }
}

Estructura del proyecto

Directorio src

El directorio src contiene la implementación principal del servicio MasterGo Magic MCP:

index.ts: Punto de entrada de la aplicación que inicializa el servidor MCP y registra todas las herramientas
http-util.ts: Utilidad para manejar solicitudes HTTP a la API de MasterGo
types.d.ts: Definiciones de tipos TypeScript para el proyecto

src/tools

Contiene las implementaciones de las herramientas MCP:

base-tool.ts: Clase base para todas las herramientas MCP
get-dsl.ts: Herramienta para recuperar datos DSL (Domain Specific Language) de archivos de diseño de MasterGo
get-component-link.ts: Herramienta para recuperar documentación de componentes desde enlaces
get-meta.ts: Herramienta para recuperar información de metadatos
get-component-workflow.ts: Herramienta que proporciona un flujo de trabajo estructurado de desarrollo de componentes para componentes Vue y React, generando archivos de flujo de trabajo y especificaciones de componentes

src/markdown

Contiene archivos markdown con documentación adicional:

meta.md: Documentación sobre la estructura y el uso de los metadatos
component-workflow.md: Documentación del flujo de trabajo de desarrollo de componentes que guía el proceso estructurado de desarrollo de componentes

Desarrollo local

Ejecuta yarn y yarn build para instalar las dependencias y compilar el código
Busca la ruta absoluta de dist/index.js
Añade la configuración MCP local con tu token

"mastergo-mcp-local": {
  "command": "node",
  "args": [
    "absolute/path/to/dist/index.js",
    "--token=mg_xxxxxx",
    "--url=https://mastergo.com",
    "--debug"
  ],
  "env": {}
},

Reinicia tu editor para asegurarte de que el MCP local esté habilitado

Después de una ejecución exitosa, puedes depurar según los resultados locales de ejecución. Puedes crear tu propio servicio MCP basado en tus modificaciones.

Agradecemos tus contribuciones de código y esperamos construir juntos el servicio MCP de MasterGo.

Licencia

ISC