Skip to content

Commit 3baf5f3

Browse files
committed
feat: add mcp server
1 parent 39758e3 commit 3baf5f3

File tree

7 files changed

+1082
-5
lines changed

7 files changed

+1082
-5
lines changed

content/3.ai/1.mcp.md

Lines changed: 284 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,284 @@
1+
---
2+
title: MCP Server
3+
description: Connect your documentation to AI tools with a native MCP server.
4+
navigation:
5+
icon: i-lucide-cpu
6+
---
7+
8+
## About MCP Servers
9+
10+
The [Model Context Protocol (MCP)](https://modelcontextprotocol.io/) is an open protocol that creates standardized connections between AI applications and external services, like documentation.
11+
12+
This documentation template includes a built-in MCP server, preparing your content for the broader AI ecosystem where any MCP client (like Claude, Cursor, VS Code, and others) can connect to your documentation.
13+
14+
### How MCP Servers Work
15+
16+
When an MCP server is connected to an AI tool, the LLM can decide to use your documentation tools during response generation:
17+
18+
- The LLM can **proactively search your documentation** while generating a response, not just when explicitly asked.
19+
- The LLM determines **when to use tools** based on the context of the conversation and the relevance of your documentation.
20+
- Each tool call happens **during the generation process**, allowing the LLM to incorporate real-time information from your documentation into its response.
21+
22+
For example, if a user asks a coding question and the LLM determines that your documentation is relevant, it can search your docs and include that information in the response without the user explicitly asking about your documentation.
23+
24+
## Accessing Your MCP Server
25+
26+
Your MCP server is automatically available at the `/mcp` path of your documentation URL.
27+
28+
::prose-note
29+
For example, if your documentation is hosted at `https://docs.example.com`, your MCP server URL is `https://docs.example.com/mcp`.
30+
::
31+
32+
## Disable the MCP Server
33+
34+
If you want to disable the MCP server, you can do so in your `nuxt.config.ts`:
35+
36+
```ts [nuxt.config.ts]
37+
export default defineNuxtConfig({
38+
mcp: {
39+
enabled: false,
40+
},
41+
})
42+
```
43+
44+
## Built-in Tools
45+
46+
This template provides two tools out of the box that allow any LLM to discover and read your documentation:
47+
48+
### `list-pages`
49+
50+
Lists all documentation pages with their titles, paths, and descriptions. AI assistants should call this first to discover available content.
51+
52+
| Parameter | Type | Description |
53+
|-----------|------|-------------|
54+
| `locale` | string (optional) | Filter pages by locale |
55+
56+
### `get-page`
57+
58+
Retrieves the full markdown content of a specific documentation page.
59+
60+
| Parameter | Type | Description |
61+
|-----------|------|-------------|
62+
| `path` | string (required) | The page path (e.g., `/en/getting-started/installation`) |
63+
64+
## Setup
65+
66+
The MCP server uses HTTP transport and can be installed in different AI assistants.
67+
68+
### Claude Code
69+
70+
Add the server using the CLI command:
71+
72+
```bash
73+
claude mcp add --transport http my-docs https://docs.example.com/mcp
74+
```
75+
76+
### Cursor
77+
78+
::install-button
79+
---
80+
url: "https://docs.example.com/mcp"
81+
ide: "cursor"
82+
label: "Install in Cursor"
83+
---
84+
::
85+
86+
Or manually create/update `.cursor/mcp.json` in your project root:
87+
88+
```json [.cursor/mcp.json]
89+
{
90+
"mcpServers": {
91+
"my-docs": {
92+
"type": "http",
93+
"url": "https://docs.example.com/mcp"
94+
}
95+
}
96+
}
97+
```
98+
99+
### Visual Studio Code
100+
101+
Ensure you have GitHub Copilot and GitHub Copilot Chat extensions installed.
102+
103+
::install-button
104+
---
105+
url: "https://docs.example.com/mcp"
106+
ide: "vscode"
107+
label: "Install in VS Code"
108+
---
109+
::
110+
111+
Or manually create/update the `.vscode/mcp.json` file:
112+
113+
```json [.vscode/mcp.json]
114+
{
115+
"servers": {
116+
"my-docs": {
117+
"type": "http",
118+
"url": "https://docs.example.com/mcp"
119+
}
120+
}
121+
}
122+
```
123+
124+
### Windsurf
125+
126+
1. Open Windsurf and navigate to **Settings** > **Windsurf Settings** > **Cascade**
127+
2. Click the **Manage MCPs** button, then select the **View raw config** option
128+
3. Add the following configuration:
129+
130+
```json [.codeium/windsurf/mcp_config.json]
131+
{
132+
"mcpServers": {
133+
"my-docs": {
134+
"type": "http",
135+
"url": "https://docs.example.com/mcp"
136+
}
137+
}
138+
}
139+
```
140+
141+
### Zed
142+
143+
1. Open Zed and go to **Settings** > **Open Settings**
144+
2. Navigate to the JSON settings file
145+
3. Add the following context server configuration:
146+
147+
```json [.config/zed/settings.json]
148+
{
149+
"context_servers": {
150+
"my-docs": {
151+
"source": "custom",
152+
"command": "npx",
153+
"args": ["mcp-remote", "https://docs.example.com/mcp"],
154+
"env": {}
155+
}
156+
}
157+
}
158+
```
159+
160+
## Customization
161+
162+
Since this template uses the [`@nuxtjs/mcp-toolkit`](https://mcp-toolkit.nuxt.dev/) module, you can extend the MCP server with custom tools, resources, prompts, and handlers.
163+
164+
### Adding Custom Tools
165+
166+
Create new tools in the `server/mcp/tools/` directory:
167+
168+
```ts [server/mcp/tools/search.ts]
169+
import { z } from 'zod'
170+
171+
export default defineMcpTool({
172+
description: 'Search documentation by keyword',
173+
inputSchema: {
174+
query: z.string().describe('The search query'),
175+
},
176+
handler: async ({ query }) => {
177+
const results = await searchDocs(query)
178+
return {
179+
content: [{ type: 'text', text: JSON.stringify(results) }],
180+
}
181+
},
182+
})
183+
```
184+
185+
### Adding Resources
186+
187+
Expose files or data sources as MCP resources in the `server/mcp/resources/` directory. The simplest way is using the `file` property:
188+
189+
```ts [server/mcp/resources/changelog.ts]
190+
export default defineMcpResource({
191+
file: 'CHANGELOG.md',
192+
metadata: {
193+
description: 'Project changelog',
194+
},
195+
})
196+
```
197+
198+
This automatically handles URI generation, MIME type detection, and file reading.
199+
200+
### Adding Prompts
201+
202+
Create reusable prompts for AI assistants in the `server/mcp/prompts/` directory:
203+
204+
```ts [server/mcp/prompts/migration-help.ts]
205+
import { z } from 'zod'
206+
207+
export default defineMcpPrompt({
208+
description: 'Get help with migrating between versions',
209+
inputSchema: {
210+
fromVersion: z.string().describe('Current version'),
211+
toVersion: z.string().describe('Target version'),
212+
},
213+
handler: async ({ fromVersion, toVersion }) => {
214+
return {
215+
messages: [{
216+
role: 'user',
217+
content: {
218+
type: 'text',
219+
text: `Help me migrate from version ${fromVersion} to ${toVersion}. What are the breaking changes and steps I need to follow?`,
220+
},
221+
}],
222+
}
223+
},
224+
})
225+
```
226+
227+
### Adding Custom Handlers
228+
229+
Handlers allow you to create separate MCP endpoints with their own tools, resources, and prompts. This is useful for exposing different capabilities at different routes.
230+
231+
For example, you could have:
232+
- `/mcp` - Main documentation MCP server
233+
- `/mcp/migration` - Dedicated MCP server for migration assistance
234+
235+
```ts [server/mcp/migration.ts]
236+
import { z } from 'zod'
237+
238+
const migrationTool = defineMcpTool({
239+
name: 'migrate-v3-to-v4',
240+
description: 'Migrate code from version 3 to version 4',
241+
inputSchema: {
242+
code: z.string().describe('The code to migrate'),
243+
},
244+
handler: async ({ code }) => {
245+
// Migration logic
246+
return {
247+
content: [{ type: 'text', text: migratedCode }],
248+
}
249+
},
250+
})
251+
252+
export default defineMcpHandler({
253+
route: '/mcp/migration',
254+
name: 'Migration Assistant',
255+
version: '1.0.0',
256+
tools: [migrationTool],
257+
})
258+
```
259+
260+
### Overwriting Built-in Tools
261+
262+
You can override the default `list-pages` or `get-page` tools by creating a tool with the same name in your project:
263+
264+
```ts [server/mcp/tools/list-pages.ts]
265+
import { z } from 'zod'
266+
267+
export default defineMcpTool({
268+
description: 'Custom list pages implementation',
269+
inputSchema: {
270+
locale: z.string().optional(),
271+
category: z.string().optional(),
272+
},
273+
handler: async ({ locale, category }) => {
274+
const pages = await getCustomPageList(locale, category)
275+
return {
276+
content: [{ type: 'text', text: JSON.stringify(pages) }],
277+
}
278+
},
279+
})
280+
```
281+
282+
::tip{to="https://mcp-toolkit.nuxt.dev/"}
283+
Check the MCP Toolkit documentation for more information about tools, resources, prompts, handlers and advanced configuration.
284+
::

content/3.ai/2.llms.md

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
---
2+
title: LLMs Integration
3+
description: Generate AI-ready content files using Nuxt LLMs module
4+
navigation:
5+
icon: i-lucide-message-circle-code
6+
---
7+
8+
This documentation template integrates `nuxt-llms` by default to prepare your content for Large Language Models (LLMs). All your documentation pages are injected and `/llms.txt` and `/llms-full.txt` files are automatically generated and pre-rendered.
9+
10+
::prose-note{to="/llms.txt"}
11+
Have a check at the `/llms.txt` file generated for this documentation.
12+
::
13+
14+
## Defaults
15+
16+
Here are the default values use to generate the `/llms.txt` file:
17+
18+
- `domain` → computed based on your deployment platform (or by using `NUXT_SITE_URL` env variable)
19+
- `title` → extracted from your `package.json`
20+
- `description` → extracted from your `package.json`
21+
- `full.title` → extracted from your `package.json`
22+
- `full.description` → extracted from your `package.json`
23+
24+
## Customize
25+
26+
You can override your LLMs data from the `nuxt.config.ts` :
27+
28+
```ts [nuxt.config.ts]
29+
export default defineNuxtConfig({
30+
llms: {
31+
domain: 'https://your-site.com',
32+
title: 'Your Site Name',
33+
description: 'A brief description of your site',
34+
full: {
35+
title: 'Your Site Name',
36+
description: 'A brief description of your site',
37+
},
38+
},
39+
})
40+
```
41+
42+
::tip{to="https://github.com/nuxt-content/nuxt-llms"}
43+
Checkout the nuxt-llms documentation for more information about the module.
44+
::

nuxt.config.ts

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,8 @@ export default defineNuxtConfig({
66
'@nuxt/ui',
77
'@nuxt/content',
88
'nuxt-og-image',
9-
'nuxt-llms'
9+
'nuxt-llms',
10+
'@nuxtjs/mcp-toolkit'
1011
],
1112

1213
devtools: {
@@ -25,6 +26,10 @@ export default defineNuxtConfig({
2526
}
2627
},
2728

29+
experimental: {
30+
asyncContext: true
31+
},
32+
2833
compatibilityDate: '2024-07-11',
2934

3035
nitro: {
@@ -74,5 +79,9 @@ export default defineNuxtConfig({
7479
]
7580
}
7681
]
82+
},
83+
84+
mcp: {
85+
name: 'Docs template'
7786
}
7887
})

package.json

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,10 +17,12 @@
1717
"@nuxt/content": "^3.8.2",
1818
"@nuxt/image": "^2.0.0",
1919
"@nuxt/ui": "^4.2.1",
20+
"@nuxtjs/mcp-toolkit": "0.5.1",
2021
"better-sqlite3": "^12.4.6",
2122
"nuxt": "^4.2.1",
2223
"nuxt-llms": "0.1.3",
23-
"nuxt-og-image": "^5.1.12"
24+
"nuxt-og-image": "^5.1.12",
25+
"zod": "^4.1.13"
2426
},
2527
"devDependencies": {
2628
"@nuxt/eslint": "^1.10.0",

0 commit comments

Comments
 (0)