Vite Plugin Vue MCP Server

@webfansplz

Repository

Basic information

About Vite Plugin Vue MCP Server

Vite plugin that enables a MCP server helping models to understand your Vue app better.

Vite Plugin Vue MCP Server config

No standard config provided

This server doesn't expose a parseable MCP config block in its README. See the repository for install instructions.

Repository

Vite Plugin Vue MCP Server tools

Tool list not available yet

This listing does not currently have a tool list to display. This does not mean the server has no tools; check its documentation for supported capabilities.

We auto-extract tools from the README. The maintainer can list them under a ## Tools heading to populate this section.

Overview

What is vite-plugin-vue-mcp?

A Vite plugin that provides a Model Context Protocol (MCP) server for Vue applications, exposing the component tree, component state, Vue Router routes, Pinia store tree, and Pinia state. Designed for Vue developers using AI-assisted coding tools like Cursor.

How to use vite-plugin-vue-mcp?

Install the package with pnpm install vite-plugin-vue-mcp -D. Then add VueMcp() to the plugins array in vite.config.ts. After starting the Vite dev server, the MCP server listens at http://localhost:[port]/__mcp/sse. For Cursor, the plugin can automatically update the .cursor/mcp.json configuration.

Key features of vite-plugin-vue-mcp

Retrieve the Vue component tree
Read component state by name
Edit component state at a specific path
Highlight a component in the browser
Get Vue Router route information
Retrieve the Pinia store tree
Read individual Pinia store state

Use cases of vite-plugin-vue-mcp

Debugging component hierarchy and state during development
Modifying component state live via AI assistant
Navigating and inspecting Vue Router routes
Exploring and debugging Pinia stores
Enhancing AI‑powered code editors with live Vue app data

Frequently asked questions

Do I need my Vue application to be running to use the MCP tools?

Yes. The README states: “Please ensure the application is running in your browser before using the features.”

Can I provide a custom MCP server instead of the built‑in tools?

Yes. The `mcpServer` option lets you supply a completely custom MCP server; when provided, the built‑in tools are ignored.

How does vite-plugin-vue-mcp integrate with Cursor?

The plugin can automatically write or update the `.cursor/mcp.json` file with the MCP server URL. This behavior is enabled by default when a `.cursor` folder exists.

What is the default endpoint of the MCP server?

The MCP server is exposed at `http://localhost:[port]/__mcp/sse`.

What are the required dependencies?

Only `vite-plugin-vue-mcp` installed as a dev dependency is required. It integrates directly into the Vite dev server.

Comments

More Developer Tools MCP servers

SSH MCP Server

hypnosis

SSH MCP server for AI agents: remote commands, file transfer, log search and server audits through OpenSSH.

offprompt

MCP server that lets Claude Code, Cursor or Codex ask you for API keys on a local page and write them to .env. The agent only ever sees key names.

directree

coburn2716

directree MCP server — query the honest software directory from any AI assistant

Yocoolab

MCP server for AI Agents — exposes Yocoolab feedback threads and design selections as tools

FARPY

mangomunchr

Verified distributed compute for humans, applications, and agents. Submit Blender, Octane, and video workloads, route them across qualified GPUs, track asynchronous execution, download finished artifacts, and verify FARP