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. 修改 claude_desktop_config.json 文件，添加您的自定义 MCP 服务器配置。
   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. 输入“Preferences: Open Workspace Settings (JSON)”并选择
3. 进入项目的 .vscode 文件夹（如无则创建）
4. 创建或编辑 mcp.json 文件，添加如下配置：

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

GitHub Copilot 代理

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

1. 打开 GitHub 仓库
2. 进入 设置 > 代码和自动化 > Copilot > 编码代理
3. 在 MCP 配置 部分添加以下配置：

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

4. 点击 保存

验证配置

验证 MCP 服务器配置正确：

1. 在仓库创建一个 issue，并分配给 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://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”
• “搜索关于 composables 的文档”
• “查找 Cloudflare 的部署指南”

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