├── test ├── exports │ ├── nuxt-mcp-dev.yaml │ └── vite-plugin-mcp.yaml ├── index.test.ts └── exports.test.ts ├── .github ├── FUNDING.yml └── workflows │ ├── release.yml │ └── ci.yml ├── .npmrc ├── CONTRIBUTING.md ├── packages ├── vite-plugin-mcp │ ├── playground │ │ ├── src │ │ │ ├── vite-env.d.ts │ │ │ ├── counter.ts │ │ │ └── main.ts │ │ ├── vite.config.ts │ │ ├── package.json │ │ └── index.html │ ├── build.config.ts │ ├── src │ │ ├── connect.ts │ │ ├── server.ts │ │ ├── types.ts │ │ └── index.ts │ ├── package.json │ └── README.md └── nuxt-mcp-dev │ ├── playground │ ├── tsconfig.json │ ├── server │ │ └── tsconfig.json │ ├── app.vue │ ├── package.json │ └── nuxt.config.ts │ ├── build.config.ts │ ├── src │ ├── types.ts │ ├── tools │ │ ├── runtime.ts │ │ └── scaffold.ts │ ├── module.ts │ └── prompts │ │ └── basic.ts │ ├── package.json │ └── README.md ├── .gitignore ├── eslint.config.js ├── alias.mjs ├── vitest.config.ts ├── .cursor └── mcp.json ├── .vscode ├── mcp.json └── settings.json ├── tsconfig.json ├── LICENSE.md ├── pnpm-workspace.yaml ├── package.json └── README.md /test/exports/nuxt-mcp-dev.yaml: -------------------------------------------------------------------------------- 1 | .: 2 | default: function 3 | -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | github: [antfu] 2 | opencollective: antfu 3 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | ignore-workspace-root-check=true 2 | shell-emulator=true 3 | -------------------------------------------------------------------------------- /test/exports/vite-plugin-mcp.yaml: -------------------------------------------------------------------------------- 1 | .: 2 | ViteMcp: function 3 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | Please refer to https://github.com/antfu/contribute 2 | -------------------------------------------------------------------------------- /packages/vite-plugin-mcp/playground/src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /packages/nuxt-mcp-dev/playground/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./.nuxt/tsconfig.json" 3 | } 4 | -------------------------------------------------------------------------------- /packages/nuxt-mcp-dev/playground/server/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../.nuxt/tsconfig.server.json" 3 | } 4 | -------------------------------------------------------------------------------- /packages/nuxt-mcp-dev/build.config.ts: -------------------------------------------------------------------------------- 1 | import { defineBuildConfig } from 'unbuild' 2 | 3 | export default defineBuildConfig({ 4 | entries: [], 5 | }) 6 | -------------------------------------------------------------------------------- /packages/nuxt-mcp-dev/playground/app.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 9 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .cache 2 | .DS_Store 3 | .idea 4 | *.log 5 | *.tgz 6 | coverage 7 | dist 8 | lib-cov 9 | logs 10 | node_modules 11 | temp 12 | .nuxt 13 | .output 14 | -------------------------------------------------------------------------------- /test/index.test.ts: -------------------------------------------------------------------------------- 1 | import { describe, expect, it } from 'vitest' 2 | 3 | describe('should', () => { 4 | it('exported', () => { 5 | expect(1).toEqual(1) 6 | }) 7 | }) 8 | -------------------------------------------------------------------------------- /eslint.config.js: -------------------------------------------------------------------------------- 1 | // @ts-check 2 | import antfu from '@antfu/eslint-config' 3 | 4 | export default antfu( 5 | { 6 | type: 'lib', 7 | pnpm: true, 8 | }, 9 | ) 10 | -------------------------------------------------------------------------------- /packages/nuxt-mcp-dev/playground/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-module-playground", 3 | "type": "module", 4 | "private": true, 5 | "dependencies": { 6 | "nuxt": "catalog:nuxt" 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /alias.mjs: -------------------------------------------------------------------------------- 1 | import { fileURLToPath } from 'node:url' 2 | 3 | const r = path => fileURLToPath(new URL(path, import.meta.url)) 4 | 5 | export default { 6 | 'vite-plugin-mcp': r('./packages/vite-plugin-mcp/src/index.ts'), 7 | } 8 | -------------------------------------------------------------------------------- /vitest.config.ts: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vitest/config' 2 | 3 | export default defineConfig({ 4 | test: { 5 | server: { 6 | deps: { 7 | inline: ['vitest-package-exports'], 8 | }, 9 | }, 10 | }, 11 | }) 12 | -------------------------------------------------------------------------------- /packages/nuxt-mcp-dev/playground/nuxt.config.ts: -------------------------------------------------------------------------------- 1 | import { defineNuxtConfig } from 'nuxt/config' 2 | 3 | export default defineNuxtConfig({ 4 | modules: ['../src/module'], 5 | devtools: { enabled: true }, 6 | compatibilityDate: '2025-03-11', 7 | debug: false, 8 | }) 9 | -------------------------------------------------------------------------------- /packages/vite-plugin-mcp/playground/vite.config.ts: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite' 2 | import { ViteMcp } from '../src' 3 | 4 | export default defineConfig({ 5 | plugins: [ 6 | ViteMcp(), 7 | ], 8 | server: { 9 | port: 5200, 10 | }, 11 | }) 12 | -------------------------------------------------------------------------------- /.cursor/mcp.json: -------------------------------------------------------------------------------- 1 | { 2 | "mcpServers": { 3 | "vite": { 4 | "url": "http://localhost:5200/__mcp/sse" 5 | }, 6 | "nuxt": { 7 | "url": "http://localhost:4000/__mcp/sse" 8 | }, 9 | "nuxt-docs": { 10 | "url": "https://mcp.nuxt.com/sse" 11 | } 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /packages/vite-plugin-mcp/playground/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "playground", 3 | "type": "module", 4 | "version": "0.3.1", 5 | "private": true, 6 | "scripts": { 7 | "dev": "DEBUG=vite:mcp:server vite", 8 | "build": "vite build", 9 | "preview": "vite preview" 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /.github/workflows/release.yml: -------------------------------------------------------------------------------- 1 | name: Release 2 | 3 | on: 4 | push: 5 | tags: 6 | - 'v*' 7 | 8 | jobs: 9 | release: 10 | uses: sxzz/workflows/.github/workflows/release.yml@v1 11 | with: 12 | publish: true 13 | permissions: 14 | contents: write 15 | id-token: write 16 | -------------------------------------------------------------------------------- /packages/vite-plugin-mcp/build.config.ts: -------------------------------------------------------------------------------- 1 | import { defineBuildConfig } from 'unbuild' 2 | 3 | export default defineBuildConfig({ 4 | entries: [ 5 | 'src/index', 6 | ], 7 | declaration: 'node16', 8 | clean: true, 9 | rollup: { 10 | inlineDependencies: [ 11 | '@antfu/utils', 12 | ], 13 | }, 14 | }) 15 | -------------------------------------------------------------------------------- /packages/vite-plugin-mcp/playground/src/counter.ts: -------------------------------------------------------------------------------- 1 | export function setupCounter(element: HTMLButtonElement): void { 2 | let counter = 0 3 | const setCounter = (count: number): void => { 4 | counter = count 5 | element.innerHTML = `count is ${counter}` 6 | } 7 | element.addEventListener('click', () => setCounter(counter + 1)) 8 | setCounter(0) 9 | } 10 | -------------------------------------------------------------------------------- /.vscode/mcp.json: -------------------------------------------------------------------------------- 1 | { 2 | "servers": { 3 | "nuxt-docs": { 4 | "type": "sse", 5 | "url": "https://mcp.nuxt.com/sse" 6 | }, 7 | "vite": { 8 | "type": "sse", 9 | "url": "http://localhost:5200/__mcp/sse" 10 | }, 11 | "nuxt": { 12 | "type": "sse", 13 | "url": "http://localhost:4000/__mcp/sse" 14 | } 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /packages/nuxt-mcp-dev/src/types.ts: -------------------------------------------------------------------------------- 1 | import type { Nuxt } from '@nuxt/schema' 2 | import type { Nitro } from 'nitropack' 3 | import type { Unimport } from 'unimport' 4 | import type { ViteDevServer } from 'vite' 5 | import type { McpServer } from 'vite-plugin-mcp' 6 | 7 | export interface McpToolContext { 8 | nuxt: Nuxt 9 | mcp: McpServer 10 | vite: ViteDevServer 11 | nitro: Promise 12 | unimport: Promise 13 | } 14 | -------------------------------------------------------------------------------- /packages/vite-plugin-mcp/playground/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Vite + TS 8 | 9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /packages/vite-plugin-mcp/playground/src/main.ts: -------------------------------------------------------------------------------- 1 | import { setupCounter } from './counter.ts' 2 | 3 | document.querySelector('#app')!.innerHTML = ` 4 |
5 |

Vite + TypeScript

6 |
7 | 8 |
9 |

10 | Click on the Vite and TypeScript logos to learn more 11 |

12 |
13 | ` 14 | 15 | setupCounter(document.querySelector('#counter')!) 16 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ESNext", 4 | "lib": ["ESNext", "DOM"], 5 | "module": "ESNext", 6 | "moduleResolution": "Bundler", 7 | "paths": { 8 | "vite-plugin-mcp": ["./packages/vite-plugin-mcp/src/index.ts"] 9 | }, 10 | "resolveJsonModule": true, 11 | "allowImportingTsExtensions": true, 12 | "strict": true, 13 | "strictNullChecks": true, 14 | "noEmit": true, 15 | "esModuleInterop": true, 16 | "verbatimModuleSyntax": true, 17 | "skipDefaultLibCheck": true, 18 | "skipLibCheck": true 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /test/exports.test.ts: -------------------------------------------------------------------------------- 1 | import { x } from 'tinyexec' 2 | import { describe, expect, it } from 'vitest' 3 | import { getPackageExportsManifest } from 'vitest-package-exports' 4 | import yaml from 'yaml' 5 | 6 | describe('exports-snapshot', async () => { 7 | const packages: { name: string, path: string, private?: boolean }[] = JSON.parse( 8 | await x('pnpm', ['ls', '--only-projects', '-r', '--json']).then(r => r.stdout), 9 | ) 10 | 11 | for (const pkg of packages) { 12 | if (pkg.private) 13 | continue 14 | it(`${pkg.name}`, async () => { 15 | const manifest = await getPackageExportsManifest({ 16 | importMode: 'src', 17 | cwd: pkg.path, 18 | }) 19 | await expect(yaml.stringify(manifest.exports)) 20 | .toMatchFileSnapshot(`./exports/${pkg.name}.yaml`) 21 | }) 22 | } 23 | }) 24 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2025-PRESENT Anthony Fu 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | // Disable the default formatter, use eslint instead 3 | "prettier.enable": false, 4 | "editor.formatOnSave": false, 5 | 6 | // Auto fix 7 | "editor.codeActionsOnSave": { 8 | "source.fixAll.eslint": "explicit", 9 | "source.organizeImports": "never" 10 | }, 11 | 12 | // Silent the stylistic rules in you IDE, but still auto fix them 13 | "eslint.rules.customizations": [ 14 | { "rule": "style/*", "severity": "off" }, 15 | { "rule": "*-indent", "severity": "off" }, 16 | { "rule": "*-spacing", "severity": "off" }, 17 | { "rule": "*-spaces", "severity": "off" }, 18 | { "rule": "*-order", "severity": "off" }, 19 | { "rule": "*-dangle", "severity": "off" }, 20 | { "rule": "*-newline", "severity": "off" }, 21 | { "rule": "*quotes", "severity": "off" }, 22 | { "rule": "*semi", "severity": "off" } 23 | ], 24 | 25 | // Enable eslint for all supported languages 26 | "eslint.validate": [ 27 | "javascript", 28 | "javascriptreact", 29 | "typescript", 30 | "typescriptreact", 31 | "vue", 32 | "html", 33 | "markdown", 34 | "json", 35 | "jsonc", 36 | "yaml" 37 | ] 38 | } 39 | -------------------------------------------------------------------------------- /.github/workflows/ci.yml: -------------------------------------------------------------------------------- 1 | name: CI 2 | 3 | on: 4 | push: 5 | branches: 6 | - main 7 | 8 | pull_request: 9 | branches: 10 | - main 11 | 12 | jobs: 13 | lint: 14 | runs-on: ubuntu-latest 15 | steps: 16 | - uses: actions/checkout@v4 17 | - uses: pnpm/action-setup@v4 18 | with: 19 | run_install: false 20 | - uses: actions/setup-node@v4 21 | with: 22 | node-version: lts/* 23 | cache: pnpm 24 | 25 | - run: pnpm i -g @antfu/ni 26 | - run: nci 27 | - run: nr lint 28 | - run: nr typecheck 29 | 30 | test: 31 | runs-on: ${{ matrix.os }} 32 | 33 | strategy: 34 | matrix: 35 | node: [lts/*] 36 | os: [ubuntu-latest, windows-latest, macos-latest] 37 | fail-fast: false 38 | 39 | steps: 40 | - uses: actions/checkout@v4 41 | - uses: pnpm/action-setup@v4 42 | with: 43 | run_install: false 44 | - name: Set node ${{ matrix.node }} 45 | uses: actions/setup-node@v4 46 | with: 47 | node-version: ${{ matrix.node }} 48 | cache: pnpm 49 | 50 | - run: pnpm i -g @antfu/ni 51 | - run: nci 52 | - run: nr build 53 | - run: nr test 54 | -------------------------------------------------------------------------------- /pnpm-workspace.yaml: -------------------------------------------------------------------------------- 1 | packages: 2 | - playground 3 | - docs 4 | - packages/* 5 | - examples/* 6 | 7 | catalogs: 8 | cli: 9 | '@antfu/eslint-config': ^6.2.0 10 | '@antfu/ni': ^27.0.1 11 | '@modelcontextprotocol/inspector': ^0.17.2 12 | bumpp: ^10.3.1 13 | eslint: ^9.39.1 14 | lint-staged: ^16.2.6 15 | nodemon: ^3.1.10 16 | simple-git-hooks: ^2.13.1 17 | tsx: ^4.20.6 18 | typescript: ~5.9.3 19 | unbuild: ^3.6.1 20 | vite: ^7.2.1 21 | vue-tsc: ^3.1.3 22 | nuxt: 23 | '@nuxt/devtools': ^3.0.1 24 | '@nuxt/eslint-config': ^1.10.0 25 | '@nuxt/kit': ^4.2.0 26 | '@nuxt/module-builder': ^1.0.2 27 | '@nuxt/schema': ^4.2.0 28 | '@nuxt/test-utils': ^3.20.1 29 | nitropack: ^2.12.9 30 | nuxi: ^3.30.0 31 | nuxt: ^4.2.0 32 | prod: 33 | '@modelcontextprotocol/sdk': ^1.21.0 34 | ansis: ^4.2.0 35 | async-cache-dedupe: ^3.3.0 36 | citty: ^0.1.6 37 | debug: ^4.4.3 38 | h3: ^1.15.4 39 | pathe: ^2.0.3 40 | unimport: ^5.5.0 41 | zod: ^3.25.76 42 | testing: 43 | vitest: ^4.0.7 44 | vitest-package-exports: ^0.1.1 45 | yaml: ^2.8.1 46 | types: 47 | '@types/debug': ^4.1.12 48 | '@types/node': latest 49 | utils: 50 | '@antfu/utils': ^9.3.0 51 | tinyexec: ^1.0.2 52 | 53 | onlyBuiltDependencies: 54 | - '@parcel/watcher' 55 | - esbuild 56 | - simple-git-hooks 57 | - unrs-resolver 58 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "type": "module", 3 | "version": "0.3.1", 4 | "private": true, 5 | "packageManager": "pnpm@10.20.0", 6 | "scripts": { 7 | "build": "pnpm -r run build", 8 | "dev": "pnpm -r run dev", 9 | "play": "pnpm -C packages/nuxt-mcp-dev play", 10 | "lint": "eslint", 11 | "release": "bumpp -r", 12 | "test": "vitest", 13 | "inspect": "npx @modelcontextprotocol/inspector", 14 | "typecheck": "tsc --noEmit", 15 | "prepare": "simple-git-hooks && nr -r dev:prepare" 16 | }, 17 | "devDependencies": { 18 | "@antfu/eslint-config": "catalog:cli", 19 | "@antfu/ni": "catalog:cli", 20 | "@antfu/utils": "catalog:utils", 21 | "@modelcontextprotocol/inspector": "catalog:cli", 22 | "@modelcontextprotocol/sdk": "catalog:prod", 23 | "@types/node": "catalog:types", 24 | "bumpp": "catalog:cli", 25 | "eslint": "catalog:cli", 26 | "h3": "catalog:prod", 27 | "lint-staged": "catalog:cli", 28 | "nodemon": "catalog:cli", 29 | "simple-git-hooks": "catalog:cli", 30 | "tinyexec": "catalog:utils", 31 | "tsx": "catalog:cli", 32 | "typescript": "catalog:cli", 33 | "unbuild": "catalog:cli", 34 | "vite": "catalog:cli", 35 | "vitest": "catalog:testing", 36 | "vitest-package-exports": "catalog:testing", 37 | "yaml": "catalog:testing", 38 | "zod": "catalog:prod" 39 | }, 40 | "resolutions": { 41 | "vite": "catalog:cli" 42 | }, 43 | "simple-git-hooks": { 44 | "pre-commit": "pnpm i --frozen-lockfile --ignore-scripts --offline && npx lint-staged" 45 | }, 46 | "lint-staged": { 47 | "*": "eslint --fix" 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /packages/vite-plugin-mcp/src/connect.ts: -------------------------------------------------------------------------------- 1 | import type { McpServer } from '@modelcontextprotocol/sdk/server/mcp.js' 2 | import type { ViteDevServer } from 'vite' 3 | import { SSEServerTransport } from '@modelcontextprotocol/sdk/server/sse.js' 4 | import DEBUG from 'debug' 5 | 6 | const debug = DEBUG('vite:mcp:server') 7 | 8 | export async function setupRoutes(base: string, server: McpServer, vite: ViteDevServer): Promise { 9 | const transports = new Map() 10 | 11 | vite.middlewares.use(`${base}/sse`, async (req, res) => { 12 | const transport = new SSEServerTransport(`${base}/messages`, res) 13 | transports.set(transport.sessionId, transport) 14 | debug('SSE Connected %s', transport.sessionId) 15 | res.on('close', () => { 16 | transports.delete(transport.sessionId) 17 | }) 18 | await server.connect(transport) 19 | }) 20 | 21 | vite.middlewares.use(`${base}/messages`, async (req, res) => { 22 | if (req.method !== 'POST') { 23 | res.statusCode = 405 24 | res.end('Method Not Allowed') 25 | return 26 | } 27 | 28 | const query = new URLSearchParams(req.url?.split('?').pop() || '') 29 | const clientId = query.get('sessionId') 30 | 31 | if (!clientId || typeof clientId !== 'string') { 32 | res.statusCode = 400 33 | res.end('Bad Request') 34 | return 35 | } 36 | 37 | const transport = transports.get(clientId) 38 | if (!transport) { 39 | res.statusCode = 404 40 | res.end('Not Found') 41 | return 42 | } 43 | 44 | debug('Message from %s', clientId) 45 | await transport.handlePostMessage(req, res) 46 | }) 47 | } 48 | -------------------------------------------------------------------------------- /packages/vite-plugin-mcp/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vite-plugin-mcp", 3 | "type": "module", 4 | "version": "0.3.1", 5 | "packageManager": "pnpm@10.20.0", 6 | "description": "MCP server helping models to understand your Vite app better.", 7 | "author": "Anthony Fu ", 8 | "license": "MIT", 9 | "funding": "https://github.com/sponsors/antfu", 10 | "homepage": "https://github.com/antfu/nuxt-mcp-dev/tree/main/packages/vite-plugin-mcp", 11 | "repository": { 12 | "type": "git", 13 | "url": "git+https://github.com/antfu/nuxt-mcp-dev.git", 14 | "directory": "packages/vite-plugin-mcp" 15 | }, 16 | "bugs": "https://github.com/antfu/nuxt-mcp-dev/issues", 17 | "keywords": [ 18 | "vite-plugin", 19 | "mcp", 20 | "modelcontextprotocol" 21 | ], 22 | "sideEffects": false, 23 | "exports": { 24 | ".": "./dist/index.mjs", 25 | "./package.json": "./package.json" 26 | }, 27 | "main": "./dist/index.mjs", 28 | "module": "./dist/index.mjs", 29 | "types": "./dist/index.d.mts", 30 | "files": [ 31 | "dist" 32 | ], 33 | "scripts": { 34 | "build": "unbuild", 35 | "dev": "unbuild --stub", 36 | "play": "nr -C playground dev", 37 | "prepublishOnly": "nr build", 38 | "start": "nodemon --exec 'tsx src/server.ts'", 39 | "dev:prepare": "nr build" 40 | }, 41 | "peerDependencies": { 42 | "vite": ">=6.0.0" 43 | }, 44 | "dependencies": { 45 | "@modelcontextprotocol/sdk": "catalog:prod", 46 | "ansis": "catalog:prod", 47 | "debug": "catalog:prod", 48 | "pathe": "catalog:prod", 49 | "zod": "catalog:prod" 50 | }, 51 | "devDependencies": { 52 | "@types/debug": "catalog:types" 53 | } 54 | } 55 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # nuxt-mcp-dev / vite-plugin-mcp 2 | 3 | [![npm version][npm-version-src]][npm-version-href] 4 | [![npm downloads][npm-downloads-src]][npm-downloads-href] 5 | [![bundle][bundle-src]][bundle-href] 6 | [![JSDocs][jsdocs-src]][jsdocs-href] 7 | [![License][license-src]][license-href] 8 | 9 | MCP server helping models to understand your Vite/Nuxt app better. 10 | 11 | This monorepo contains two packages: 12 | 13 | - [`nuxt-mcp-dev`](./packages/nuxt-mcp-dev) - A Nuxt module for adding MCP support to your Nuxt dev server. 14 | - [`vite-plugin-mcp`](./packages/vite-plugin-mcp) - A Vite plugin for adding MCP support to your Vite app. 15 | 16 | > [!IMPORTANT] 17 | > Experimental. Use with caution. 18 | 19 | > If you are looking to build a MCP server for your Nuxt application, checkout the [@nuxtjs/mcp-toolkit](https://github.com/nuxt-modules/mcp-toolkit) module. 20 | 21 | ## Sponsors 22 | 23 |

24 | 25 | 26 | 27 |

28 | 29 | ## License 30 | 31 | [MIT](./LICENSE) License © [Anthony Fu](https://github.com/antfu) 32 | 33 | 34 | 35 | [npm-version-src]: https://img.shields.io/npm/v/nuxt-mcp-dev?style=flat&colorA=080f12&colorB=1fa669 36 | [npm-version-href]: https://npmjs.com/package/nuxt-mcp-dev 37 | [npm-downloads-src]: https://img.shields.io/npm/dm/nuxt-mcp-dev?style=flat&colorA=080f12&colorB=1fa669 38 | [npm-downloads-href]: https://npmjs.com/package/nuxt-mcp-dev 39 | [bundle-src]: https://img.shields.io/bundlephobia/minzip/nuxt-mcp-dev?style=flat&colorA=080f12&colorB=1fa669&label=minzip 40 | [bundle-href]: https://bundlephobia.com/result?p=nuxt-mcp-dev 41 | [license-src]: https://img.shields.io/github/license/antfu/nuxt-mcp-dev.svg?style=flat&colorA=080f12&colorB=1fa669 42 | [license-href]: https://github.com/antfu/nuxt-mcp-dev/blob/main/LICENSE 43 | [jsdocs-src]: https://img.shields.io/badge/jsdocs-reference-080f12?style=flat&colorA=080f12&colorB=1fa669 44 | [jsdocs-href]: https://www.jsdocs.io/package/nuxt-mcp-dev 45 | -------------------------------------------------------------------------------- /packages/vite-plugin-mcp/src/server.ts: -------------------------------------------------------------------------------- 1 | import type { ViteDevServer } from 'vite' 2 | import type { ViteMcpOptions } from './types' 3 | import { McpServer } from '@modelcontextprotocol/sdk/server/mcp.js' 4 | import { z } from 'zod' 5 | import { version } from '../package.json' 6 | 7 | export function createMcpServerDefault( 8 | options: ViteMcpOptions, 9 | vite: ViteDevServer, 10 | ): McpServer { 11 | const server = new McpServer( 12 | { 13 | name: 'vite', 14 | version, 15 | ...options.mcpServerInfo, 16 | }, 17 | ) 18 | 19 | server.tool( 20 | 'get-vite-config', 21 | 'Get the Vite config digest, including the root, resolve, plugins, and environment names.', 22 | {}, 23 | async () => ({ 24 | content: [{ 25 | type: 'text', 26 | text: JSON.stringify({ 27 | root: vite.config.root, 28 | resolve: vite.config.resolve, 29 | plugins: vite.config.plugins.map(p => p.name).filter(Boolean), 30 | environmentNames: Object.keys(vite.environments), 31 | }), 32 | }], 33 | }), 34 | ) 35 | 36 | server.tool( 37 | 'get-vite-module-info', 38 | 'Get graph information of a module, including importers, imported modules, and compiled result.', 39 | { 40 | filepath: z.string() 41 | .describe('The absolute filepath of the module'), 42 | }, 43 | async ({ filepath }) => { 44 | const records: any[] = [] 45 | Object.entries(vite.environments).forEach(([key, env]) => { 46 | const mods = env.moduleGraph.getModulesByFile(filepath) 47 | for (const mod of mods || []) { 48 | records.push({ 49 | environment: key, 50 | id: mod.id, 51 | url: mod.url, 52 | importers: Array.from(mod.importers), 53 | importedModules: Array.from(mod.importedModules), 54 | meta: mod.meta, 55 | lastHMRTimestamp: mod.lastHMRTimestamp, 56 | transformResult: mod.transformResult, 57 | }) 58 | } 59 | }) 60 | return { 61 | content: [{ 62 | type: 'text', 63 | text: JSON.stringify(records), 64 | }], 65 | } 66 | }, 67 | ) 68 | 69 | return server 70 | } 71 | -------------------------------------------------------------------------------- /packages/nuxt-mcp-dev/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "nuxt-mcp-dev", 3 | "type": "module", 4 | "version": "0.3.1", 5 | "description": "MCP server from your Nuxt dev server helping models to understand your Nuxt app better.", 6 | "license": "MIT", 7 | "homepage": "https://github.com/antfu/nuxt-mcp-dev#readme", 8 | "repository": "antfu/nuxt-mcp-dev", 9 | "bugs": "https://github.com/antfu/nuxt-mcp-dev/issues", 10 | "keywords": [ 11 | "nuxt", 12 | "mcp", 13 | "modelcontextprotocol" 14 | ], 15 | "sideEffects": false, 16 | "exports": { 17 | ".": "./dist/module.mjs" 18 | }, 19 | "main": "./dist/module.mjs", 20 | "module": "./dist/module.mjs", 21 | "types": "./dist/types.d.mts", 22 | "files": [ 23 | "dist" 24 | ], 25 | "scripts": { 26 | "build": "nuxt-module-build build", 27 | "prepublishOnly": "nr build", 28 | "play": "DEBUG=nuxt:mcp:server,vite:mcp:server PORT=4000 nuxi dev playground", 29 | "play:build": "nuxi build playground", 30 | "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground" 31 | }, 32 | "peerDependencies": { 33 | "nitropack": "^2 || ^3", 34 | "nuxi": ">=3", 35 | "nuxt": ">=3.5.0", 36 | "vite": ">=6" 37 | }, 38 | "dependencies": { 39 | "@modelcontextprotocol/sdk": "catalog:prod", 40 | "@nuxt/kit": "catalog:nuxt", 41 | "ansis": "catalog:prod", 42 | "async-cache-dedupe": "catalog:prod", 43 | "citty": "catalog:prod", 44 | "debug": "catalog:prod", 45 | "pathe": "catalog:prod", 46 | "unimport": "catalog:prod", 47 | "vite-plugin-mcp": "workspace:*", 48 | "zod": "catalog:prod" 49 | }, 50 | "devDependencies": { 51 | "@nuxt/devtools": "catalog:nuxt", 52 | "@nuxt/eslint-config": "catalog:nuxt", 53 | "@nuxt/module-builder": "catalog:nuxt", 54 | "@nuxt/schema": "catalog:nuxt", 55 | "@nuxt/test-utils": "catalog:nuxt", 56 | "@types/debug": "catalog:types", 57 | "@types/node": "catalog:types", 58 | "eslint": "catalog:cli", 59 | "nitropack": "catalog:nuxt", 60 | "nuxi": "catalog:nuxt", 61 | "nuxt": "catalog:nuxt", 62 | "typescript": "catalog:cli", 63 | "vitest": "catalog:testing", 64 | "vue-tsc": "catalog:cli" 65 | } 66 | } 67 | -------------------------------------------------------------------------------- /packages/vite-plugin-mcp/README.md: -------------------------------------------------------------------------------- 1 | # vite-plugin-mcp 2 | 3 | [![npm version][npm-version-src]][npm-version-href] 4 | [![npm downloads][npm-downloads-src]][npm-downloads-href] 5 | [![bundle][bundle-src]][bundle-href] 6 | [![JSDocs][jsdocs-src]][jsdocs-href] 7 | [![License][license-src]][license-href] 8 | 9 | Vite plugin that enables a MCP server for your Vite app to provide information about your setup and modules graphs. 10 | 11 | > [!IMPORTANT] 12 | > Experimental. Not ready for production. 13 | 14 | ```ts 15 | import { defineConfig } from 'vite' 16 | import { ViteMcp } from 'vite-plugin-mcp' 17 | 18 | export default defineConfig({ 19 | plugins: [ 20 | ViteMcp() 21 | ], 22 | }) 23 | ``` 24 | 25 | Then the MCP server will be available at `http://localhost:5173/__mcp/sse`. 26 | 27 | > 💡 When using VSCode, Cursor, Windsurf, Claude Code, the module will automatically update the config files for you. 28 | > 29 | > You can configure that in the options with `updateConfig` and `updateConfigServerName`. 30 | 31 | ## Sponsors 32 | 33 |

34 | 35 | 36 | 37 |

38 | 39 | ## License 40 | 41 | [MIT](./LICENSE) License © [Anthony Fu](https://github.com/antfu) 42 | 43 | 44 | 45 | [npm-version-src]: https://img.shields.io/npm/v/vite-plugin-mcp?style=flat&colorA=080f12&colorB=1fa669 46 | [npm-version-href]: https://npmjs.com/package/vite-plugin-mcp 47 | [npm-downloads-src]: https://img.shields.io/npm/dm/vite-plugin-mcp?style=flat&colorA=080f12&colorB=1fa669 48 | [npm-downloads-href]: https://npmjs.com/package/vite-plugin-mcp 49 | [bundle-src]: https://img.shields.io/bundlephobia/minzip/vite-plugin-mcp?style=flat&colorA=080f12&colorB=1fa669&label=minzip 50 | [bundle-href]: https://bundlephobia.com/result?p=vite-plugin-mcp 51 | [license-src]: https://img.shields.io/github/license/antfu/vite-plugin-mcp.svg?style=flat&colorA=080f12&colorB=1fa669 52 | [license-href]: https://github.com/antfu/vite-plugin-mcp/blob/main/LICENSE 53 | [jsdocs-src]: https://img.shields.io/badge/jsdocs-reference-080f12?style=flat&colorA=080f12&colorB=1fa669 54 | [jsdocs-href]: https://www.jsdocs.io/package/vite-plugin-mcp 55 | -------------------------------------------------------------------------------- /packages/nuxt-mcp-dev/README.md: -------------------------------------------------------------------------------- 1 | # nuxt-mcp-dev 2 | 3 | [![npm version][npm-version-src]][npm-version-href] 4 | [![npm downloads][npm-downloads-src]][npm-downloads-href] 5 | [![bundle][bundle-src]][bundle-href] 6 | [![JSDocs][jsdocs-src]][jsdocs-href] 7 | [![License][license-src]][license-href] 8 | 9 | MCP server helping models to understand your Nuxt app better. 10 | 11 | > [!IMPORTANT] 12 | > Experimental. Use with caution. 13 | 14 | ```ts 15 | // nuxt.config.ts 16 | 17 | export default defineNuxtConfig({ 18 | modules: ['nuxt-mcp-dev'], 19 | }) 20 | ``` 21 | 22 | Then the MCP server will be available at `http://localhost:3000/__mcp/sse`. 23 | 24 | > 💡 When using VSCode, Cursor, Windsurf, Claude Code, the module will automatically update the config files for you. 25 | 26 | ## Module Hooks 27 | 28 | For other modules to provide additional information to MCP, you can use the `mcp:setup` hook. 29 | 30 | ```ts 31 | // src/module.ts 32 | 33 | export default defineNuxtModule({ 34 | meta: { 35 | name: 'my-module', 36 | }, 37 | async setup(options, nuxt) { 38 | nuxt.hook('mcp:setup', ({ mcp }) => { 39 | // Setup your MCP tools here 40 | // For example 41 | mcp.tool('get-nuxt-root', 'Get the Nuxt root path', {}, async () => { 42 | return { 43 | content: [{ 44 | type: 'text', 45 | text: nuxt.options.rootDir, 46 | }], 47 | } 48 | }) 49 | }) 50 | }, 51 | }) 52 | ``` 53 | 54 | ## Sponsors 55 | 56 |

57 | 58 | 59 | 60 |

61 | 62 | ## License 63 | 64 | [MIT](./LICENSE) License © [Anthony Fu](https://github.com/antfu) 65 | 66 | 67 | 68 | [npm-version-src]: https://img.shields.io/npm/v/nuxt-mcp-dev?style=flat&colorA=080f12&colorB=1fa669 69 | [npm-version-href]: https://npmjs.com/package/nuxt-mcp-dev 70 | [npm-downloads-src]: https://img.shields.io/npm/dm/nuxt-mcp-dev?style=flat&colorA=080f12&colorB=1fa669 71 | [npm-downloads-href]: https://npmjs.com/package/nuxt-mcp-dev 72 | [bundle-src]: https://img.shields.io/bundlephobia/minzip/nuxt-mcp-dev?style=flat&colorA=080f12&colorB=1fa669&label=minzip 73 | [bundle-href]: https://bundlephobia.com/result?p=nuxt-mcp-dev 74 | [license-src]: https://img.shields.io/github/license/antfu/nuxt-mcp-dev.svg?style=flat&colorA=080f12&colorB=1fa669 75 | [license-href]: https://github.com/antfu/nuxt-mcp-dev/blob/main/LICENSE 76 | [jsdocs-src]: https://img.shields.io/badge/jsdocs-reference-080f12?style=flat&colorA=080f12&colorB=1fa669 77 | [jsdocs-href]: https://www.jsdocs.io/package/nuxt-mcp-dev 78 | -------------------------------------------------------------------------------- /packages/vite-plugin-mcp/src/types.ts: -------------------------------------------------------------------------------- 1 | import type { Awaitable } from '@antfu/utils' 2 | import type { McpServer } from '@modelcontextprotocol/sdk/server/mcp.js' 3 | import type { Implementation as McpServerInfo } from '@modelcontextprotocol/sdk/types.js' 4 | import type { ViteDevServer } from 'vite' 5 | 6 | export type SupportedUpdateConfigType = 'cursor' | 'vscode' | 'windsurf' | 'claude-code' 7 | 8 | export interface UpdateConfigAdditionalServer { 9 | name: string 10 | url: string 11 | } 12 | 13 | export type MaybeArray = T | T[] 14 | 15 | export type { McpServer } 16 | 17 | export interface ViteMcpOptions { 18 | /** 19 | * The host to listen on, default is `localhost` 20 | */ 21 | host?: string 22 | 23 | /** 24 | * The port to listen on, default is the port of the Vite dev server 25 | */ 26 | port?: number 27 | 28 | /** 29 | * Print the MCP server URL in the console 30 | * 31 | * @default true 32 | */ 33 | printUrl?: boolean 34 | 35 | /** 36 | * The MCP server info. Ingored when `mcpServer` is provided 37 | */ 38 | mcpServerInfo?: McpServerInfo 39 | 40 | /** 41 | * Custom MCP server, when this is provided, the built-in MCP tools will be ignored 42 | */ 43 | mcpServer?: (viteServer: ViteDevServer) => Awaitable 44 | 45 | /** 46 | * Setup the MCP server, this is called when the MCP server is created 47 | * You may also return a new MCP server to replace the default one 48 | */ 49 | mcpServerSetup?: (server: McpServer, viteServer: ViteDevServer) => Awaitable 50 | 51 | /** 52 | * The root route to the MCP server, default is `/__mcp` 53 | */ 54 | mcpRouteRoot?: string 55 | 56 | /** 57 | * The config types to update 58 | * 59 | * - `auto` - Automatically update the config files if they exists 60 | * - `cursor` - Update the cursor config file `.cursor/mcp.json` 61 | * - `vscode` - Update the VSCode config file `.vscode/settings.json` 62 | * - `windsurf` - Update the Windsurf config file `~/.codeium/windsurf/mcp_config.json` 63 | * - `claude-code` - Update the Claude Code config file `.mcp.json` 64 | * 65 | * @default 'auto' 66 | */ 67 | updateConfig?: 'auto' | false | MaybeArray 68 | 69 | /** 70 | * Additional servers to update the config files 71 | */ 72 | updateConfigAdditionalServers?: UpdateConfigAdditionalServer[] 73 | 74 | /** 75 | * The name of the MCP server when updating the config files 76 | * 77 | * @default 'vite' 78 | */ 79 | updateConfigServerName?: string 80 | 81 | // --------- DEPRECATED --------- 82 | 83 | /** 84 | * @deprecated Use `mcpRouteRoot` instead 85 | */ 86 | mcpPath?: string 87 | } 88 | -------------------------------------------------------------------------------- /packages/nuxt-mcp-dev/src/tools/runtime.ts: -------------------------------------------------------------------------------- 1 | import type { Component, NuxtPage } from '@nuxt/schema' 2 | import type { McpToolContext } from '../types' 3 | import { useNuxt } from '@nuxt/kit' 4 | 5 | export function useToolsRuntime(): { 6 | registerTools: (context: McpToolContext) => void 7 | } { 8 | const nuxt = useNuxt() 9 | 10 | let pages: NuxtPage[] = [] 11 | nuxt.hook('pages:extend', (_pages) => { 12 | pages = _pages 13 | }) 14 | 15 | let components: Component[] = [] 16 | nuxt.hook('components:extend', (_components) => { 17 | components = _components 18 | }) 19 | 20 | function registerTools({ mcp, unimport }: McpToolContext): void { 21 | mcp.tool( 22 | 'get-nuxt-config', 23 | 'Get the Nuxt configuration, including the ssr, appDir, srcDir, rootDir, alias, runtimeConfig, modules, etc.', 24 | {}, 25 | async () => { 26 | return { 27 | content: [{ 28 | type: 'text', 29 | text: JSON.stringify({ 30 | ssr: !!nuxt.options.ssr, 31 | appDir: nuxt.options.appDir, 32 | srcDir: nuxt.options.srcDir, 33 | rootDir: nuxt.options.rootDir, 34 | alias: nuxt.options.alias, 35 | runtimeConfig: { 36 | public: nuxt.options.runtimeConfig.public, 37 | }, 38 | modules: nuxt.options._installedModules.map(i => i.meta.name || (i as any).name).filter(Boolean), 39 | imports: { 40 | autoImport: !!nuxt.options.imports.autoImport, 41 | ...nuxt.options.imports, 42 | }, 43 | components: nuxt.options.components, 44 | }), 45 | }], 46 | } 47 | }, 48 | ) 49 | 50 | mcp.tool( 51 | 'list-nuxt-auto-imports-items', 52 | 'List auto-imports items, when importing new functions to the code, check available items from this tool.', 53 | {}, 54 | async () => { 55 | return { 56 | content: [{ 57 | type: 'text', 58 | text: JSON.stringify({ 59 | items: await (await unimport).getImports(), 60 | }, null, 2), 61 | }], 62 | } 63 | }, 64 | ) 65 | 66 | mcp.tool( 67 | 'list-nuxt-components', 68 | 'List registered components in the Nuxt app. When adding importing new components, check available components from this tool.', 69 | {}, 70 | async () => { 71 | return { 72 | content: [{ 73 | type: 'text', 74 | text: JSON.stringify(components, null, 2), 75 | }], 76 | } 77 | }, 78 | ) 79 | 80 | mcp.tool( 81 | 'list-nuxt-pages', 82 | 'List registered pages and their metadata in the Nuxt app.', 83 | {}, 84 | async () => { 85 | return { 86 | content: [{ 87 | type: 'text', 88 | text: JSON.stringify(pages, null, 2), 89 | }], 90 | } 91 | }, 92 | ) 93 | } 94 | 95 | return { registerTools } 96 | } 97 | -------------------------------------------------------------------------------- /packages/nuxt-mcp-dev/src/module.ts: -------------------------------------------------------------------------------- 1 | import type { Nitro } from 'nitropack' 2 | import type { Unimport } from 'unimport' 3 | import type { ViteMcpOptions } from 'vite-plugin-mcp' 4 | import type { McpToolContext } from './types' 5 | import { addVitePlugin, defineNuxtModule } from '@nuxt/kit' 6 | import { ViteMcp } from 'vite-plugin-mcp' 7 | import { promptNuxtBasic } from './prompts/basic' 8 | import { useToolsRuntime } from './tools/runtime' 9 | import { toolsScaffold } from './tools/scaffold' 10 | 11 | export interface ModuleOptions extends ViteMcpOptions { 12 | /** 13 | * Includes the online Nuxt MCP server from https://mcp.nuxt.com/sse 14 | * 15 | * This MCP would provide information about the Nuxt ecosystem, including 16 | * the latest documentation, available modules, etc. 17 | * 18 | * @default true 19 | */ 20 | includeNuxtDocsMcp?: boolean 21 | } 22 | 23 | export interface ModuleHooks { 24 | 'mcp:setup': (context: McpToolContext) => void 25 | } 26 | 27 | export default defineNuxtModule({ 28 | meta: { 29 | name: 'nuxt-mcp-dev', 30 | configKey: 'mcp', 31 | }, 32 | defaults: { 33 | includeNuxtDocsMcp: true, 34 | }, 35 | async setup(options, nuxt) { 36 | const unimport = promiseWithResolve() 37 | const nitro = promiseWithResolve() 38 | const { registerTools } = useToolsRuntime() 39 | 40 | nuxt.hook('imports:context', (_unimport) => { 41 | unimport.resolve(_unimport) 42 | }) 43 | nuxt.hook('nitro:init', (_nitro) => { 44 | nitro.resolve(_nitro) 45 | }) 46 | 47 | addVitePlugin(ViteMcp({ 48 | updateConfigServerName: 'nuxt', 49 | ...options, 50 | updateConfigAdditionalServers: [ 51 | ...options.updateConfigAdditionalServers || [], 52 | ...( 53 | options.includeNuxtDocsMcp 54 | ? [{ 55 | name: 'nuxt-docs', 56 | url: 'https://mcp.nuxt.com/sse', 57 | }] 58 | : []), 59 | ], 60 | port: options.port || nuxt.options.devServer.port, 61 | async mcpServerSetup(mcp, vite) { 62 | await options.mcpServerSetup?.(mcp, vite) 63 | 64 | const context: McpToolContext = { 65 | unimport: unimport.promise, 66 | nitro: nitro.promise, 67 | nuxt, 68 | vite, 69 | mcp, 70 | } 71 | 72 | promptNuxtBasic(context) 73 | registerTools(context) 74 | toolsScaffold(context) 75 | 76 | // eslint-disable-next-line ts/ban-ts-comment 77 | // @ts-ignore skip type infer 78 | await nuxt.callHook('mcp:setup', context) 79 | }, 80 | }), { client: true, server: false }) 81 | }, 82 | }) 83 | 84 | function promiseWithResolve(): { promise: Promise, resolve: (value: T) => void } { 85 | let resolve: (value: T) => void = undefined! 86 | const promise = new Promise((_resolve) => { 87 | resolve = _resolve 88 | }) 89 | return { promise, resolve } 90 | } 91 | 92 | declare module 'nuxt/schema' { 93 | interface NuxtHooks { 94 | 'mcp:setup': (ctx: McpToolContext) => void | Promise 95 | } 96 | } 97 | 98 | declare module '@nuxt/schema' { 99 | interface NuxtHooks { 100 | 'mcp:setup': (ctx: McpToolContext) => void | Promise 101 | } 102 | } 103 | -------------------------------------------------------------------------------- /packages/nuxt-mcp-dev/src/tools/scaffold.ts: -------------------------------------------------------------------------------- 1 | import type { CommandDef } from 'citty' 2 | import type { McpToolContext } from '../types' 3 | import process from 'node:process' 4 | import c from 'ansis' 5 | import { z } from 'zod' 6 | 7 | interface AddArgs { 8 | cwd?: string 9 | force?: boolean 10 | template: string 11 | name: string 12 | } 13 | 14 | export function toolsScaffold({ mcp, nuxt }: McpToolContext): void { 15 | const setup = async (): Promise<{ add: CommandDef, run: typeof import('citty')['runCommand'] }> => { 16 | const { main } = await import('nuxi') 17 | const add = await (await main.subCommands! as any).add() as CommandDef 18 | const { runCommand: run } = await import('citty') 19 | return { 20 | add, 21 | run, 22 | } 23 | } 24 | 25 | const promise = setup() 26 | 27 | async function add(args: string[], options?: AddArgs): Promise { 28 | const { add, run } = await promise 29 | return await run(add, { 30 | rawArgs: [ 31 | '--cwd', 32 | nuxt.options.rootDir, 33 | ...args, 34 | ], 35 | data: { 36 | cwd: nuxt.options.rootDir, 37 | ...options, 38 | }, 39 | }).then(r => r.result) 40 | } 41 | 42 | mcp.tool( 43 | 'nuxt-scaffold', 44 | 'Scaffold a new component/page/layout/middleware etc. in the current Nuxt project.', 45 | { 46 | // api, app, app-config, component, composable, error, layer, layout, middleware, module, page, plugin, server-middleware, server-plugin, server-route, server-util 47 | template: z.enum(['api', 'app', 'app-config', 'component', 'composable', 'error', 'layer', 'layout', 'middleware', 'module', 'page', 'plugin', 'server-middleware', 'server-plugin', 'server-route', 'server-util']) 48 | .describe('Type of the file to scaffold'), 49 | name: z.string() 50 | .describe('Name of the component to add'), 51 | }, 52 | async ({ template, name }) => { 53 | const { stdout, stderr, result } = await interceptStdout(async () => { 54 | return await add([ 55 | template, 56 | name, 57 | ]) 58 | }) 59 | return { 60 | content: [{ 61 | type: 'text', 62 | text: JSON.stringify({ 63 | nuxtRoot: nuxt.options.rootDir, 64 | nuxtSrcDir: nuxt.options.srcDir, 65 | cliResult: { 66 | stdout, 67 | stderr, 68 | result: String(result) || 'OK', 69 | }, 70 | }, null, 2), 71 | }], 72 | } 73 | }, 74 | ) 75 | } 76 | 77 | async function interceptStdout(fn: () => Promise | T): Promise<{ 78 | stdout: string 79 | stderr: string 80 | result: T 81 | }> { 82 | const stdout: string[] = [] 83 | const stderr: string[] = [] 84 | 85 | const oldStdout = process.stdout.write 86 | const oldStderr = process.stderr.write 87 | process.stdout.write = (chunk) => { 88 | stdout.push(chunk.toString()) 89 | return oldStdout.call(process.stdout, chunk) 90 | } 91 | process.stderr.write = (chunk) => { 92 | stderr.push(chunk.toString()) 93 | return oldStderr.call(process.stderr, chunk) 94 | } 95 | try { 96 | const result = await fn() 97 | return { 98 | stdout: c.strip(stdout.join('\n')), 99 | stderr: c.strip(stderr.join('\n')), 100 | result, 101 | } 102 | } 103 | finally { 104 | process.stdout.write = oldStdout 105 | process.stderr.write = oldStderr 106 | } 107 | } 108 | -------------------------------------------------------------------------------- /packages/vite-plugin-mcp/src/index.ts: -------------------------------------------------------------------------------- 1 | import type { Plugin, ViteDevServer } from 'vite' 2 | import type { ViteMcpOptions } from './types' 3 | import { existsSync } from 'node:fs' 4 | import fs from 'node:fs/promises' 5 | import { homedir } from 'node:os' 6 | import c from 'ansis' 7 | import { join } from 'pathe' 8 | import { searchForWorkspaceRoot } from 'vite' 9 | import { setupRoutes } from './connect' 10 | 11 | export * from './types' 12 | 13 | const CONSOLE_LOG_PREFIX = c.cyan.bold`[MCP] ` 14 | 15 | export function ViteMcp(options: ViteMcpOptions = {}): Plugin { 16 | const { 17 | printUrl = true, 18 | mcpServer = (vite: ViteDevServer) => import('./server').then(m => m.createMcpServerDefault(options, vite)), 19 | } = options 20 | 21 | const mcpRoute = options.mcpRouteRoot ?? options.mcpPath ?? '/__mcp' 22 | 23 | return { 24 | name: 'vite-plugin-mcp', 25 | async configureServer(vite) { 26 | let mcp = await mcpServer(vite) 27 | mcp = await options.mcpServerSetup?.(mcp, vite) || mcp 28 | await setupRoutes(mcpRoute, mcp, vite) 29 | 30 | const port = vite.config.server.port 31 | const root = searchForWorkspaceRoot(vite.config.root) 32 | 33 | const protocol = vite.config.server.https ? 'https' : 'http' 34 | const sseUrl = `${protocol}://${options.host || 'localhost'}:${options.port || port}${mcpRoute}/sse` 35 | 36 | if (printUrl) { 37 | // eslint-disable-next-line no-console 38 | console.log(`${c.cyan` ➜ MCP: `}${c.gray(`Mcp server is running at ${c.green(sseUrl)}`)}`) 39 | } 40 | await updateConfigs(root, sseUrl, options, vite) 41 | }, 42 | } 43 | } 44 | 45 | async function updateConfigs( 46 | root: string, 47 | sseUrl: string, 48 | options: ViteMcpOptions, 49 | vite: ViteDevServer, 50 | ): Promise { 51 | const { 52 | updateConfig = 'auto', 53 | updateConfigServerName = 'vite', 54 | updateConfigAdditionalServers = [], 55 | } = options 56 | 57 | if (updateConfig === false) 58 | return 59 | 60 | const configs = updateConfig === 'auto' 61 | ? [ 62 | existsSync(join(root, '.cursor')) ? 'cursor' as const : null, 63 | existsSync(join(root, '.vscode')) ? 'vscode' as const : null, 64 | existsSync(join(homedir(), '.codeium', 'windsurf')) ? 'windsurf' as const : null, 65 | existsSync(join(root, '.mcp.json')) ? 'claude-code' as const : null, 66 | ].filter(x => x !== null) 67 | : Array.isArray(updateConfig) 68 | ? updateConfig 69 | : [] 70 | 71 | // Cursor 72 | if (configs.includes('cursor')) { 73 | await fs.mkdir(join(root, '.cursor'), { recursive: true }) 74 | const mcp = existsSync(join(root, '.cursor/mcp.json')) 75 | ? JSON.parse(await fs.readFile(join(root, '.cursor/mcp.json'), 'utf-8') || '{}') 76 | : {} 77 | mcp.mcpServers ||= {} 78 | mcp.mcpServers[updateConfigServerName || 'vite'] = { url: sseUrl } 79 | for (const server of updateConfigAdditionalServers) { 80 | mcp.mcpServers[server.name] = { url: server.url } 81 | } 82 | await fs.writeFile(join(root, '.cursor/mcp.json'), `${JSON.stringify(mcp, null, 2)}\n`) 83 | vite.config.logger.info(`${CONSOLE_LOG_PREFIX}${c.gray(`Updated config file ${join(root, '.cursor/mcp.json')}`)}`) 84 | } 85 | 86 | // VSCode 87 | if (configs.includes('vscode')) { 88 | await fs.mkdir(join(root, '.vscode'), { recursive: true }) 89 | const mcp = existsSync(join(root, '.vscode/mcp.json')) 90 | ? JSON.parse(await fs.readFile(join(root, '.vscode/mcp.json'), 'utf-8') || '{}') 91 | : {} 92 | mcp.servers ||= {} 93 | mcp.servers[updateConfigServerName || 'vite'] = { 94 | type: 'sse', 95 | url: sseUrl, 96 | } 97 | for (const server of updateConfigAdditionalServers) { 98 | mcp.servers[server.name] = { 99 | type: 'sse', 100 | url: server.url, 101 | } 102 | } 103 | await fs.writeFile(join(root, '.vscode/mcp.json'), `${JSON.stringify(mcp, null, 2)}\n`) 104 | vite.config.logger.info(`${CONSOLE_LOG_PREFIX}${c.gray(`Updated config file ${join(root, '.vscode/mcp.json')}`)}`) 105 | } 106 | 107 | // Windsurf 108 | if (configs.includes('windsurf')) { 109 | const windsurfDir = join(homedir(), '.codeium', 'windsurf') 110 | const windsurfConfigPath = join(windsurfDir, 'mcp_config.json') 111 | try { 112 | await fs.mkdir(windsurfDir, { recursive: true }) 113 | const config = existsSync(windsurfConfigPath) 114 | ? JSON.parse(await fs.readFile(windsurfConfigPath, 'utf-8').catch(() => '{}') || '{}') 115 | : {} 116 | config.mcpServers ||= {} 117 | config.mcpServers[updateConfigServerName || 'vite'] = { serverUrl: sseUrl } 118 | for (const server of updateConfigAdditionalServers) { 119 | config.mcpServers[server.name] = { serverUrl: server.url } 120 | } 121 | await fs.writeFile(windsurfConfigPath, `${JSON.stringify(config, null, 2)}\n`) 122 | vite.config.logger.info(`${CONSOLE_LOG_PREFIX}${c.gray(`Updated config file ${windsurfConfigPath}`)}`) 123 | } 124 | catch (e) { 125 | vite.config.logger.error(`${CONSOLE_LOG_PREFIX}${c.red(`Failed to update ${windsurfConfigPath}`)}${e}`) 126 | } 127 | } 128 | 129 | // Claude Code 130 | if (configs.includes('claude-code')) { 131 | const mcp = existsSync(join(root, '.mcp.json')) 132 | ? JSON.parse(await fs.readFile(join(root, '.mcp.json'), 'utf-8') || '{}') 133 | : {} 134 | mcp.mcpServers ||= {} 135 | mcp.mcpServers[updateConfigServerName || 'vite'] = { 136 | type: 'sse', 137 | url: sseUrl, 138 | } 139 | for (const server of updateConfigAdditionalServers) { 140 | mcp.mcpServers[server.name] = { 141 | type: 'sse', 142 | url: server.url, 143 | } 144 | } 145 | await fs.writeFile(join(root, '.mcp.json'), `${JSON.stringify(mcp, null, 2)}\n`) 146 | vite.config.logger.info(`${CONSOLE_LOG_PREFIX}${c.gray(`Updated config file ${join(root, '.mcp.json')}`)}`) 147 | } 148 | } 149 | -------------------------------------------------------------------------------- /packages/nuxt-mcp-dev/src/prompts/basic.ts: -------------------------------------------------------------------------------- 1 | import type { McpToolContext } from '../types' 2 | 3 | export function promptNuxtBasic({ mcp, nuxt }: McpToolContext): void { 4 | mcp.prompt('nuxt-basic', () => { 5 | const lines: string[] = [] 6 | 7 | lines.push(` 8 | You are a professional developer specializing in Nuxt and Vue. 9 | 10 | This nuxt project is configured with following structure: 11 | - Root directory: ${nuxt.options.rootDir} 12 | - App directory: ${nuxt.options.appDir} 13 | - Source code directory: ${nuxt.options.srcDir} 14 | - Server directory: ${nuxt.options.serverDir} 15 | 16 | `) 17 | 18 | // TODO: components, typescript, tailwind, unocss 19 | 20 | if (nuxt.options.ssr) { 21 | lines.push(` 22 | ## SSR 23 | 24 | This is a Nuxt 3 application with SSR enabled. Components should be isomorphic and can be executed on both the server and client sides. 25 | 26 | In scenarios where you need different logic for server and client, use \`import.meta.client\` and \`import.meta.server\` 27 | to branch the code, and use dynamic imports if needed. 28 | `) 29 | } 30 | else { 31 | lines.push(` 32 | ## CSR 33 | 34 | This is a Nuxt 3 application with SSR disabled. While components are primarily rendered on the client side, still try to make the code as isomorphic as possible to be future-proof. 35 | `) 36 | } 37 | 38 | if (nuxt.options.imports.autoImport) { 39 | lines.push(` 40 | ## Auto-imports 41 | 42 | This Nuxt project is configured to have auto-imports enabled. 43 | 44 | For example, Vue apis (ref, computed, watch, etc.) are auto-imported, so you can directly use them in your code without import statements. 45 | 46 | You can find the full auto-import items with tool \`list-nuxt-auto-imports-items\`. 47 | `) 48 | } 49 | else { 50 | lines.push(` 51 | ## No auto-imports 52 | 53 | This Nuxt project is configured to have auto-imports disabled. 54 | 55 | You can still reference the registered entries with tool \`list-nuxt-auto-imports-items\`. 56 | But you need to always manually import the usages when modifying the code, either directly import the item from their source, 57 | or use explicit \`import { xxx } from '#imports'\` to import any items from the registry. 58 | `) 59 | } 60 | 61 | // reference prompts from https://github.com/antfu/nuxt-mcp-dev/issues/2 by @DannyVogel 62 | // lines.push(` 63 | // - This is a Nuxt 3 application using the Composition API with 82 | // - Always handle all data fetching states in templates: 83 | // 88 | 89 | // - Follow component best practices: 90 | 91 | // - Create small, focused components for specific tasks 92 | // - Use defineModel for two-way binding between parent and child components 93 | // - Use props for passing data down to child components 94 | // - Use emits for communicating events up to parent components 95 | // - Use composables for shared state and logic across components 96 | // - Use Pinia for global state management 97 | // - Consider provide/inject only for specific cases like theme providers or deeply nested component trees 98 | 99 | // - Always structure Vue Single File Components in this exact order: 100 | 101 | // 1.