mrcp

Small framework for MCP apps with Vite + React.

Conventions

• Define UI resources (React components) in resources/**.
  • The default export is used as the resource component.
  • The resource name is derived from the file path under resources/ (for example resources/base-ui.tsx -> "base-ui").
• Define tools (functions) in tools/**.
  • Tool UI linkage is app.resource, which is type-safe against discovered resource names.
• Vite generates virtual modules:
  • virtual:mcp-resources
  • virtual:mcp-tools
• Resources are server-rendered and then hydrated in the frontend via resource-hydrate.tsx.
• Hydration script is injected inline in resource HTML (no external <script src="...">).
• Tailwind CSS is enabled in Vite for both dev and production builds (production output is pruned automatically by Tailwind).

Commands

npm install
npm run dev

Dev server runs on http://localhost:3001/mcp and hot-loads resources/tools through Vite SSR.

npm run build

Build outputs compiled server code to dist/.

In both dev and production, the full hydration JavaScript is inlined into the resource HTML.

npm run start

Starts the compiled server from dist/server.js.

CLI

This package exposes two binaries:

• mrcp with commands: dev, build, start, check, generate-types
• create-mrcp to scaffold a new MRCP app

Example:

npx create-mrcp my-mcp-app
cd my-mcp-app
npm install
npm run dev