Nuxt MCP 服务器

什么是 MCP？

MCP（模型上下文协议）是一个标准化协议，使 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 或全部）
• get_documentation_page: 按路径检索文档页面内容和详细信息
• get_getting_started_guide: 获取特定 Nuxt 版本的入门指南

博客

• list_blog_posts: 列出所有 Nuxt 博客文章，包含元数据包括日期、类别和标签
• get_blog_post: 按路径检索博客文章内容和详细信息

部署

• list_deploy_providers: 列出 Nuxt 应用程序的所有部署提供商和托管平台
• get_deploy_provider: 按路径检索部署提供商的详细信息和说明

提示

Nuxt MCP 服务器为常见工作流程提供引导式提示：

• find_documentation_for_topic: 为特定主题或功能查找最佳 Nuxt 文档
• deployment_guide: 获取特定托管提供商的部署说明
• migration_help: 获取 Nuxt 版本之间的迁移帮助

您可以使用 / 通过 Claude Code 等工具访问这些提示。

设置

Nuxt MCP 服务器使用 HTTP 传输，可以在不同的 AI 助手中安装。

ChatGPT

按照以下步骤在 ChatGPT 中设置 Nuxt 作为连接器：

1. 启用开发者模式：
   • 转到设置 → 连接器 → 高级设置 → 开发者模式
2. 打开 ChatGPT 设置
3. 在连接器选项卡中，创建新连接器：
   • 命名：Nuxt
   • MCP 服务器 URL：https://nuxt.com/mcp
   • 身份验证：无
4. 点击创建

Nuxt 连接器将在稍后的对话中出现在作曲者的"开发者模式"工具中。

Claude Code

使用 CLI 命令添加服务器：

claude mcp add --transport http nuxt-remote https://nuxt.com/mcp

Claude Desktop

设置说明

1. 打开 Claude Desktop 并导航到"设置" > "开发者"。
2. 点击"编辑配置"。这将打开本地 Claude 目录。
3. 使用您的自定义 MCP 服务器配置修改 claude_desktop_config.json 文件。
   claude_desktop_config.json

   {
     "mcpServers": {
       "nuxt": {
         "command": "npx",
         "args": [
           "mcp-remote",
           "https://nuxt.com/mcp"
         ]
       }
     }
   }
   

4. 重启 Claude Desktop 应用程序。Nuxt MCP 服务器现在应该已注册。

Cursor

点击下面的按钮直接在 Cursor 中安装 Nuxt MCP 服务器：

手动设置，请按照以下步骤操作：

1. 打开 Cursor 并转到"设置" > "工具和 MCP"
2. 添加 Nuxt MCP 服务器配置

或在项目根目录中手动创建/更新 .cursor/mcp.json：

{
  "mcpServers": {
    "nuxt": {
      "type": "http",
      "url": "https://nuxt.com/mcp"
    }
  }
}

Le Chat Mistral

1. 导航到"智能" > "连接器"
2. 点击"添加连接器"按钮，然后选择"自定义 MCP 连接器"
3. 创建您的自定义 MCP 连接器：
   • 连接器名称：Nuxt
   • 连接器服务器：https://nuxt.com/mcp

Visual Studio Code

1. 打开 VS Code 并访问命令面板（Ctrl/Cmd + Shift + P）
2. 输入"首选项：打开工作区设置 (JSON)"并选择它
3. 导航到项目的 .vscode 文件夹，如果不存在则创建一个
4. 使用以下配置创建或编辑 mcp.json 文件：

{
  "servers": {
    "nuxt": {
      "type": "http",
      "url": "https://nuxt.com/mcp"
    }
  }
}

GitHub Copilot Agent

如果您已经在 VS Code 中配置了 MCP 服务器（将 servers 键替换为 GitHub Copilot Agent 的 mcpServers），则可以利用类似的配置为 GitHub Copilot 编码代理。您需要添加一个 tools 键，指定哪些工具可用于 Copilot。

1. 导航到您的 GitHub 仓库
2. 转到 设置 > 代码和自动化 > Copilot > 编码代理
3. 在 MCP 配置 部分中，添加以下配置：

   {
     "mcpServers": {
       "nuxt": {
         "type": "http",
         "url": "https://nuxt.com/mcp",
         "tools": ["*"]
       }
     }
   }
   

4. 点击 保存

验证配置

要验证 MCP 服务器配置是否正确：

1. 在您的仓库中创建一个问题并将其分配给 Copilot
2. 等待 Copilot 创建拉取请求
3. 在拉取请求中，点击"Copilot 开始工作"时间线事件中的 查看会话
4. 点击右上角的省略号按钮 (...)，然后在侧边栏中点击 Copilot
5. 展开 启动 MCP 服务器 步骤以查看配置的 Nuxt 工具

有关在 GitHub Copilot 编码代理中使用 MCP 的更多信息，请参阅 使用 MCP 扩展编码代理。

Windsurf

1. 打开 Windsurf 并导航到"设置" > "Windsurf 设置" > "Cascade"
2. 点击"管理 MCP"按钮，然后选择"查看原始配置"选项
3. 将以下配置添加到您的 MCP 设置中：

{
  "mcpServers": {
    "nuxt": {
      "type": "http",
      "url": "https://nuxt.com/mcp"
    }
  }
}

Zed

1. 打开 Zed 并转到"设置" > "打开设置"
2. 导航到 JSON 设置文件
3. 将以下上下文服务器配置添加到您的设置中：

{
  "context_servers": {
    "nuxt": {
      "source": "custom",
      "command": "npx",
      "args": ["mcp-remote", "https://nuxt.com/mcp"],
      "env": {}
    }
  }
}

Opencode

1. 在项目根目录中，创建 opencode.json
2. 添加以下配置：

{
  "$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"
• "搜索关于组合式函数的文档"
• "查找 Cloudflare 的部署指南"

AI 助手将使用 MCP 服务器获取结构化的 JSON 数据，并为 Nuxt 开发提供引导式帮助。