TanStack Start Devtools MCP

Puente de desarrollo local entre TanStack Devtools y agentes de codificación compatibles con MCP.

Este repositorio es una herramienta local de clonar y usar, no un paquete publicado en npm. Consulta INSTALL.md para obtener instrucciones de configuración y un prompt de instalación para el agente.

Paquetes

• @barreloflube/tanstack-start-dev-tool-mcp-shared: esquemas de protocolo compartidos entre navegador y servidor.

• @barreloflube/tanstack-start-dev-tool-mcp-react: panel de React para @tanstack/react-devtools.

• @barreloflube/tanstack-start-dev-tool-mcp-server: servidor MCP más puente WebSocket local.

Related MCP server: MCP Chrome Debugger Protocol

Desarrollo

pnpm install
pnpm dev:mcp

pnpm dev:mcp utiliza tsx watch, por lo que las ediciones en el servidor MCP reinician el proceso automáticamente.

Entorno

• TANSTACK_AGENT_DEVTOOLS_PORT: puerto del puente, por defecto 8129.

• TANSTACK_AGENT_DEVTOOLS_HOST: host del puente, por defecto 127.0.0.1.

• TANSTACK_AGENT_DEVTOOLS_TOKEN: token compartido entre navegador y servidor, por defecto tanstack-agent-devtools-local.

Configuración del cliente MCP

Para clientes basados en stdio:

{
  "mcpServers": {
    "tanstack-start-devtools": {
      "command": "/Users/barreloflube/Desktop/tanstack-start-dev-tool-mcp/node_modules/.bin/tsx",
      "args": [
        "/Users/barreloflube/Desktop/tanstack-start-dev-tool-mcp/packages/mcp-server/src/cli.ts"
      ],
      "env": {
        "TANSTACK_AGENT_DEVTOOLS_TOKEN": "tanstack-agent-devtools-local"
      }
    }
  }
}

Para clientes stdio, inicia tsx directamente en lugar de pnpm mcp; los banners del ciclo de vida del gestor de paquetes pueden corromper el flujo JSON-RPC de MCP.

Codex inicia su propio proceso MCP. Detén pnpm dev:mcp antes de reiniciar Codex a menos que estés probando intencionalmente el servidor de desarrollo con vigilancia.

Prompts utilizados para construir esto

1. “i want to make a mcp server that allows the tanstack start dev tool's access to the agent. how should we go around making it”

2. “i want a sep personal repo for this.”

3. “you can make the sep repo in the Desktop/tanstack-start-dev-tool-mcp folder and work in there, import it here and start the mcp server test it, dont stop until it works, also support hmr for the mcp server so you can itereate quickly.”