Nuxt MCP 服务器
什么是 MCP?
MCP(Model Context Protocol,模型上下文协议)是一种标准化协议,使 AI 助手能够访问外部数据源和工具。Nuxt 提供了一个 MCP 服务器,允许像 Claude Code、Cursor 和 Windsurf 这样的 AI 助手直接访问文档、博客文章和部署指南。
该 MCP 服务器提供结构化访问 Nuxt 文档的能力,使 AI 工具更容易理解并协助 Nuxt 开发。
资源
Nuxt MCP 服务器提供以下可发现资源:
resource://nuxt-com/documentation-pages:浏览所有可用的文档页面(默认使用 v4.x 版本)resource://nuxt-com/blog-posts:浏览所有 Nuxt 博客文章,包括版本发布和教程resource://nuxt-com/deploy-providers:浏览所有部署提供商和托管平台
你可以通过使用像 Claude Code 这样的工具,配合 @ 符号来访问这些资源。
工具
Nuxt MCP 服务器提供了以下按类别组织的工具:
文档
list_documentation_pages: 列出所有可用的 Nuxt 文档页面及其分类和基本信息。支持版本筛选(3.x、4.x、5.x 或全部)get_documentation_page: 通过路径检索文档页面内容和详情get_getting_started_guide: 获取特定 Nuxt 版本的入门指南
博客
list_blog_posts:列出所有 Nuxt 博客文章及其元数据,包括日期、分类和标签get_blog_post:通过路径检索博客文章内容和详情
部署
list_deploy_providers:列出所有 Nuxt 应用的部署提供商和托管平台get_deploy_provider:通过路径检索部署提供商详情和使用说明
模块
list_modules: 列出所有可用的 Nuxt 模块,可按下载量、星标数或日期进行可选筛选和排序get_module: 检索特定模块的完整详情,包括 README、兼容性、维护者和统计信息
更新日志
get_changelog: 检索 Nuxt 核心和官方模块的最新发布信息
提示
Nuxt MCP 服务器提供了针对常见工作流的引导式提示:
find_documentation_for_topic:查找某个特定主题或功能的最佳 Nuxt 文档deployment_guide:获取某个特定托管提供商的部署指南migration_help:获取 Nuxt 版本间迁移的帮助
你可以通过使用像 Claude Code 这样的工具,配合 / 符号来访问这些提示。
设置
Nuxt MCP 服务器使用 HTTP 传输协议,且可安装在不同的 AI 助手中。
ChatGPT
按照以下步骤在 ChatGPT 中设置 Nuxt 连接器:
- 启用开发者模式:
- 前往设置 → 连接器 → 高级设置 → 开发者模式
- 打开 ChatGPT 设置
- 在连接器标签页中,新建连接器:
- 命名为:
Nuxt - MCP 服务器 URL:
https://nuxt.com/mcp - 认证方式:
无
- 命名为:
- 点击创建
Nuxt 连接器随后会出现在对话编辑器的“开发者模式”工具中。
Claude Code
使用 CLI 命令添加服务器:
claude mcp add --transport http nuxt https://nuxt.com/mcp
Claude Desktop
设置说明
- 打开 Claude Desktop,进入“设置” > “开发者”
- 点击“编辑配置”,将打开本地 Claude 目录
- 修改
claude_desktop_config.json文件,添加你的自定义 MCP 服务器配置claude_desktop_config.json{ "mcpServers": { "nuxt": { "command": "npx", "args": [ "mcp-remote", "https://nuxt.com/mcp" ] } } } - 重启 Claude Desktop 应用,Nuxt MCP 服务器应已注册。
Cursor
点击下面按钮,直接在 Cursor 中安装 Nuxt MCP 服务器:
安装 MCP 服务器手动设置步骤:
- 打开 Cursor,进入“设置” > “工具与 MCP”
- 添加 Nuxt MCP 服务器配置
或者手动在项目根目录创建/更新 .cursor/mcp.json:
{
"mcpServers": {
"nuxt": {
"type": "http",
"url": "https://nuxt.com/mcp"
}
}
}
Gemini CLI
- 定位你的 Gemini CLI 配置文件(通常是
~/.gemini/settings.json,或以你的环境中指定的路径为准)。 - 将以下配置添加到你的
mcpServers对象中:
{
"mcpServers": {
"nuxt": {
"httpUrl": "https://nuxt.com/mcp"
}
}
}
- 重启你的终端会话或重新加载 CLI。Nuxt MCP 服务器工具现在即可使用。
Le Chat Mistral
- 导航至“智能” > “连接器”
- 点击“添加连接器”按钮,然后选择“自定义 MCP 连接器”
- 创建你的自定义 MCP 连接器:
- 连接器名称:
Nuxt - 服务器 URL:
https://nuxt.com/mcp
- 连接器名称:
Visual Studio Code
- 打开 VS Code,调出命令面板(Ctrl/Cmd + Shift + P)
- 输入“Preferences: Open Workspace Settings (JSON)” 并选择
- 前往项目的
.vscode文件夹(如果不存在则创建) - 创建或编辑
mcp.json文件,添加以下配置:
{
"servers": {
"nuxt": {
"type": "http",
"url": "https://nuxt.com/mcp"
}
}
}
GitHub Copilot Agent
如果你已在 VS Code 配置了 MCP 服务器(注意将 servers 键改为 mcpServers 以适配 GitHub Copilot Agent),你可以用类似配置为 Copilot 编码代理设定 MCP 服务器。需要添加 tools 键指定 Copilot 可用的工具。
步骤:
- 进入你的 GitHub 仓库
- 打开 设置 > 代码与自动化 > Copilot > 编码代理
- 在 MCP 配置 区块,添加以下内容:
{
"mcpServers": {
"nuxt": {
"type": "http",
"url": "https://nuxt.com/mcp",
"tools": ["*"]
}
}
}
- 点击 保存
验证配置
验证 MCP 服务器是否正确配置:
- 在仓库中新建一个 Issue 并分配给 Copilot
- 等待 Copilot 创建 Pull Request
- 在 PR 页面,点击“Copilot 开始工作”时间线事件中的 查看会话
- 点击右上角的省略号按钮(...),然后在侧边栏点击 Copilot
- 展开 启动 MCP 服务器 步骤,查看已配置的 Nuxt 工具
更多信息请见 使用 MCP 扩展 GitHub Copilot 编码代理。
GitHub Copilot CLI
- 在交互模式下启动 GitHub Copilot CLI。
- 运行
/mcp add。 - 在配置表单中填写:
- 服务器名称:
nuxt - 服务器类型:
HTTP - URL:
https://nuxt.com/mcp - HTTP 头:留空
- 工具:
*
- 服务器名称:
- 按 Ctrl+S 保存。无需重启 CLI,MCP 服务器会立即可用。
或者将服务器直接添加到 ~/.copilot/mcp-config.json:
{
"mcpServers": {
"nuxt": {
"type": "http",
"url": "https://nuxt.com/mcp",
"tools": ["*"]
}
}
}
使用 /mcp show 确认服务器已配置且可用。
更多详情请见 为 GitHub Copilot CLI 添加 MCP 服务器。
Google Antigravity
- 通过编辑器代理面板顶部的“...”下拉菜单打开 MCP 商店。
- 点击“管理 MCP 服务器”
- 点击“查看原始配置”
- 使用你的自定义 MCP 服务器配置修改
mcp_config.json:
{
"mcpServers": {
"nuxt": {
"serverUrl": "https://nuxt.com/mcp"
}
}
}
- 返回“管理 MCP 服务器”标签页并点击“刷新”。Nuxt MCP 服务器现在应该会出现。
Windsurf
- 打开 Windsurf,进入“设置” > “Windsurf 设置” > “级联”
- 点击“管理 MCP”,然后选择“查看原始配置”
- 在 MCP 设置中添加以下配置:
{
"mcpServers": {
"nuxt": {
"serverUrl": "https://nuxt.com/mcp"
}
}
}
Zed
- 打开 Zed,进入“设置” > “打开设置”
- 打开 JSON 设置文件
- 在设置中添加如下上下文服务器配置:
{
"context_servers": {
"nuxt": {
"url": "https://nuxt.com/mcp"
}
}
}
Opencode
- 在项目根目录创建
opencode.json - 添加以下配置:
{
"$schema": "https://opencode.ai/config.json",
"mcp": {
"nuxt": {
"type": "remote",
"url": "https://nuxt.com/mcp",
"enabled": true
}
}
}
提示示例
配置完成后,你可以向 AI 助手提出如下问题:
- “列出所有可用的 Nuxt 文档页面”
- “获取入门文档”
- “v3 和 v4 有什么区别?”
- “我该如何部署到 Vercel?”
- “展示最新的博客文章”
- “帮助我从 Nuxt 3 迁移到 Nuxt 4”
- “搜索有关 composables 的文档”
- “查找 Cloudflare 的部署指南”
AI 助手将通过 MCP 服务器获取结构化 JSON 数据,并为 Nuxt 开发提供引导式支持。