Nuxt DevTools

v0.3.2Developer Toolsstable

MCP server helping models to understand your Vite/Nuxt app better.

mcpnuxtvitevite-pluginmodelcontextprotocol
Share:
907
Stars
0
Downloads
0
Weekly
0/5

What is Nuxt DevTools?

Nuxt DevTools is a Model Context Protocol (MCP) server that allows AI assistants like Claude, Cursor, and VS Code to mcp server helping models to understand your vite/nuxt app better.

MCP server helping models to understand your Vite/Nuxt app better.

This server falls under the Developer Tools category on MCPgee, the world's largest MCP server directory with 33,000+ servers.

Features

  • MCP server helping models to understand your Vite/Nuxt app b

Use Cases

MCP server helping models to understand your Vite/Nuxt app better.
antfu

Maintainer

LicenseMIT
Languagetypescript
Versionv0.3.2
UpdatedMay 19, 2026
Statushealthy
Maintenanceactive

Works with

ClaudeOpenAIwindowsmacoslinux

Installation

NPM

npx -y vite-plugin-mcp

Manual Installation

npx -y vite-plugin-mcp

Configuration

Configuration Details

Config File

claude_desktop_config.json

Performance

Response Metrics

Response Time< 200ms
ThroughputMedium

Resource Usage

Memory UsageLow
CPU UsageLow

How to Set Up and Use Nuxt DevTools

Nuxt MCP Dev provides an MCP server integration for Vite and Nuxt applications, giving Claude deeper understanding of your app's structure, configuration, and components. Use it to enable AI assistance that understands your Nuxt project architecture, component relationships, and development setup for better code generation and analysis.

Prerequisites

  • A Nuxt or Vite project set up locally
  • Node.js 18+ installed
  • An MCP client such as Claude Desktop or Cursor
  • npm or yarn package manager
1

Install vite-plugin-mcp

Install the Vite plugin that powers Nuxt MCP Dev.

npx -y vite-plugin-mcp
2

Add plugin to your Vite/Nuxt config

Integrate vite-plugin-mcp into your project's vite.config.ts or nuxt.config.ts file. Check the repository README at https://github.com/antfu/nuxt-mcp-dev for integration details.

3

Register in MCP client

Add the Nuxt MCP Dev server to your Claude Desktop or Cursor configuration.

{
  "mcpServers": {
    "nuxt-mcp-dev": {
      "command": "npx",
      "args": ["-y", "vite-plugin-mcp"]
    }
  }
}
4

Start your dev server

Run your Nuxt or Vite dev server. The MCP plugin will start alongside it, providing app context to Claude.

5

Restart client and explore

Restart Claude Desktop or Cursor and ask Claude about your project structure, components, and configuration.

Nuxt DevTools Examples

MCP Configuration Example

How to register Nuxt MCP Dev in your client.

{
  "mcpServers": {
    "nuxt-mcp-dev": {
      "command": "npx",
      "args": ["-y", "vite-plugin-mcp"]
    }
  }
}

Prompts to Try

Ask Claude about your Nuxt/Vite application.

1. "What components are available in my Nuxt project?"
2. "Show me the project structure and explain the routing setup"
3. "What plugins and modules are configured in my Nuxt app?"
4. "Analyze the component dependencies in my project"
5. "Help me understand the Vite build configuration"

Troubleshooting Nuxt DevTools

Plugin fails to load in Vite config

Ensure vite-plugin-mcp is properly imported in your vite.config.ts or nuxt.config.ts. Check the repository documentation for correct integration syntax.

App context not available to Claude

Verify your dev server is running and the Vite plugin is active. Restart both the dev server and Claude Desktop to re-establish connection.

Performance impact from the plugin

The Vite plugin should have minimal impact. If you experience slowdowns, check that only necessary context is being exposed to Claude.

Frequently Asked Questions about Nuxt DevTools

What is Nuxt DevTools?

Nuxt DevTools is a Model Context Protocol (MCP) server that mcp server helping models to understand your vite/nuxt app better. It connects AI assistants to external tools and data sources through a standardized interface.

How do I install Nuxt DevTools?

Install via npm with the command: npx -y vite-plugin-mcp. Then add the server configuration to your AI client's JSON config file (e.g., claude_desktop_config.json or .cursor/mcp.json).

Which AI clients work with Nuxt DevTools?

Nuxt DevTools works with all major MCP-compatible AI clients including Claude Desktop, Claude Code, Cursor, VS Code (GitHub Copilot), Windsurf, and Cline.

Is Nuxt DevTools free to use?

Yes, Nuxt DevTools is open source and available under the MIT license. You can use it freely in both personal and commercial projects.

Browse More Developer Tools MCP Servers

Explore all developer tools servers available in the MCPgee directory. Each server includes setup guides for Claude, Cursor, and VS Code.

Quick Config Preview

{ "mcpServers": { "nuxt-mcp-dev": { "command": "npx", "args": ["-y", "vite-plugin-mcp"] } } }

Add this to your claude_desktop_config.json or .cursor/mcp.json

Read the full setup guide →

Ready to use Nuxt DevTools?

Browse our complete directory of 33,000+ MCP servers, read setup guides for your editor, and start building with the Model Context Protocol.

33,000+ ServersFree & Open SourceStep-by-Step Guides