Getting Started

Installation

Install and configure the Nuxt MCP module in your project.

Prerequisites

  • Nuxt 3.x or 4.x
  • Node.js 18.x or higher
  • A package manager (npm, pnpm, yarn, or bun)

Installation

Install the module

You can install the module automatically or manually.

Automatic Installation

Use the nuxt command to install the module and add it to your configuration automatically:

npx nuxt module add mcp-toolkit

Manual Installation

Install @nuxtjs/mcp-toolkit and its peer dependency zod:

pnpm add @nuxtjs/mcp-toolkit zod

Add to Nuxt config

Add the module to your nuxt.config.ts:

nuxt.config.ts
export default defineNuxtConfig({
  modules: ['@nuxtjs/mcp-toolkit'],
})

Configure the module (optional)

The module works with sensible defaults, but you can customize it:

nuxt.config.ts
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/)
  },
})

Verify Installation

After installation, you can verify everything is working by:

  1. Checking the server route: Start your Nuxt dev server and visit http://localhost:3000/mcp (or your custom route). You should be redirected to your configured browserRedirect URL.
  2. Creating a test tool: Create a simple tool to test:
server/mcp/tools/test.ts
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}`,
      }],
    }
  },
})
  1. Checking auto-imports: The defineMcpTool, defineMcpResource, defineMcpPrompt, and defineMcpHandler functions should be auto-imported in your server files.

Project Structure

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

Next Steps

Now that you have the module installed: