You can install the module automatically or manually.
Use the nuxt command to install the module and add it to your configuration automatically:
npx nuxt module add mcp-toolkit
Install @nuxtjs/mcp-toolkit and its peer dependency zod:
pnpm add @nuxtjs/mcp-toolkit zod
npm install @nuxtjs/mcp-toolkit zod
yarn add @nuxtjs/mcp-toolkit zod
bun add @nuxtjs/mcp-toolkit zod
Add the module to your nuxt.config.ts:
export default defineNuxtConfig({
modules: ['@nuxtjs/mcp-toolkit'],
})
The module works with sensible defaults, but you can customize it:
export default defineNuxtConfig({
modules: ['@nuxtjs/mcp-toolkit'],
mcp: {
name: 'My MCP Server',
route: '/mcp', // Default route for the MCP server
dir: 'mcp', // Base directory for MCP definitions (relative to server/)
},
})
After installation, you can verify everything is working by:
http://localhost:3000/mcp (or your custom route). You should be redirected to your configured browserRedirect URL.import { z } from 'zod'
export default defineMcpTool({
name: 'test',
description: 'A simple test tool',
inputSchema: {
message: z.string(),
},
handler: async ({ message }) => {
return {
content: [{
type: 'text',
text: `Test successful: ${message}`,
}],
}
},
})
defineMcpTool, defineMcpResource, defineMcpPrompt, and defineMcpHandler functions should be auto-imported in your server files.After installation, your project structure should look like this:
your-project/
├── server/
│ └── mcp/
│ ├── tools/
│ │ └── echo.ts # Your tool definitions
│ ├── resources/
│ │ └── readme.ts # Your resource definitions
│ └── prompts/
│ └── greeting.ts # Your prompt definitions
├── nuxt.config.ts
└── package.json
Now that you have the module installed: