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://nuxtjs.org.cn/mcp
   • 身份验证：无
4. 点击“创建”

Nuxt 连接器稍后会在对话中出现在“开发者模式”工具的撰写器中。

Claude Code

使用 CLI 命令添加服务器

claude mcp add --transport http nuxt-remote https://nuxtjs.org.cn/mcp

Claude 桌面版

设置说明

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

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

4. 重启 Claude 桌面版应用。现在应该已经注册了 Nuxt MCP 服务器。

Cursor

点击下面的按钮，将 Nuxt MCP 服务器直接安装到 Cursor 中

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

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

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

{
  "mcpServers": {
    "nuxt": {
      "type": "http",
      "url": "https://nuxtjs.org.cn/mcp"
    }
  }
}

Le Chat Mistral

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

Visual Studio Code

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

{
  "servers": {
    "nuxt": {
      "type": "http",
      "url": "https://nuxtjs.org.cn/mcp"
    }
  }
}

GitHub Copilot Agent

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

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

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

4. 点击 **保存**

验证配置

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

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

有关将 MCP 与 GitHub Copilot 编码代理一起使用的更多信息，请参阅使用 MCP 扩展编码代理.

Windsurf

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

{
  "mcpServers": {
    "nuxt": {
      "type": "http",
      "url": "https://nuxtjs.org.cn/mcp"
    }
  }
}

Zed

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

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

Opencode

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

{
  "$schema": "https://opencode.ac.cn/config.json",
  "mcp": {
    "nuxt": {
      "type": "remote",
      "url": "https://nuxtjs.org.cn/mcp",
      "enabled": true
    }
  }
}

提示示例

配置完成后，您可以向您的 AI 助手提出以下问题：

• “列出所有可用的 Nuxt 文档页面”
• “获取介绍文档”
• “v3 和 v4 有什么区别？”
• “我如何部署到 Vercel？”
• “显示我最新的博客文章”
• “帮助我从 Nuxt 3 迁移到 Nuxt 4”
• “搜索有关组合式函数 (composables) 的文档”
• “查找 Cloudflare 的部署指南”

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