M8 框架文档助手 MCP Server

M8 框架文档助手是一个基于 Model Context Protocol (MCP) 的智能开发辅助工具，帮助开发者快速查询和使用 M8 移动前端跨端框架的组件、EJS 原生 API，并根据项目需求智能推荐合适的组件和方法。

功能特性

• 🔍 组件搜索: 按名称或功能描述搜索 M8 框架 UI 组件
• 📚 API 查询: 搜索 EJS 原生 API，支持按模块或功能描述搜索
• 🔧 Util 工具搜索: 搜索 M8 框架 Util 工具方法（如 Util.ajax、Util.upload）
• 💡 智能推荐: 根据需求描述智能推荐合适的组件、API 和 Util 方法
• 🛠️ 代码生成: 生成符合 M8 框架规范的 Vue 代码（支持 M8.3/Vue2 和 M8.4/Vue3）
• ✅ 兼容性检查: 检查组件或 API 在目标平台的兼容性
• 📋 典型模式: 获取常见场景的实现模式（列表详情、表单提交等）
• 📖 编码规范: 查询和管理编码规范文档（CSS、Vue、JavaScript 等）

快速开始

前置要求

• Node.js >= 18.0.0

在 AI 工具中配置

Cursor

在 Cursor 设置中找到 MCP 配置，添加：

{
  "mcpServers": {
    "m8-framework": {
      "command": "npx",
      "args": ["-y", "m8-framework-mcp"]
    }
  }
}

Claude Desktop

编辑配置文件：

• Windows: %APPDATA%\Claude\claude_desktop_config.json
• macOS: ~/Library/Application Support/Claude/claude_desktop_config.json

{
  "mcpServers": {
    "m8-framework": {
      "command": "npx",
      "args": ["-y", "m8-framework-mcp"]
    }
  }
}

验证安装

配置完成后，重启你的 AI 工具，然后尝试：

帮我搜索 M8 框架的 button 组件

如果返回了组件信息，说明配置成功！

使用示例

搜索组件

搜索 M8 框架的日期选择组件

搜索 API

搜索 EJS 的拍照 API

智能推荐

我需要实现一个带表单验证的用户注册页面，请推荐合适的组件

生成代码

帮我生成一个 M8.4 版本的 button 组件使用示例

检查兼容性

检查 picker 组件在微信和支付宝小程序的兼容性

获取典型模式

获取列表详情页的实现模式

搜索 Util 方法

搜索 M8 框架的 ajax 方法

获取编码规范

获取 Vue 组件编码规范
列出所有可用的编码规范

可用工具列表

| 工具名 | 说明 | |--------|------| | search_component | 搜索 M8 框架 UI 组件 | | search_ejs_api | 搜索 EJS 原生 API | | search_util | 搜索 Util 工具方法（如 ajax、upload） | | get_component_detail | 获取组件完整文档 | | get_api_detail | 获取 API 完整文档 | | get_util_detail | 获取 Util 方法完整文档 | | recommend | 根据需求智能推荐（优先推荐 Util 方法） | | generate_code | 生成符合规范的代码 | | check_compatibility | 检查平台兼容性 | | get_pattern | 获取典型实现模式 | | get_standard | 获取编码规范文档 | | list_standards | 列出所有可用的编码规范 |

重要说明

HTTP 请求推荐使用 Util.ajax

当你询问关于 HTTP 请求、ajax、接口调用等问题时，MCP 会优先推荐 Util.ajax 而不是 EJS API：

// ✅ 推荐使用 Util.ajax
Util.ajax({
  url: Config.serverUrl + '/api/data',
  type: 'POST',
  data: { params: JSON.stringify(params) },
  dataPath: 'data',
  success: (result) => {
    console.log('成功:', result);
  },
  error: (err) => {
    console.error('失败:', err);
  }
});

// ❌ 不存在的 API
ejs.http.post('/api/data');  // 这个 API 不存在！

编码规范

MCP 内置了多种编码规范，可以通过 list_standards 查看所有规范，通过 get_standard 获取详细内容：

• vue-style: Vue 组件编码规范
• css-style: CSS/SCSS 编码规范
• js-style: JavaScript/TypeScript 编码规范
• project-structure: 项目结构规范

高级配置

使用自定义文档路径

如果你有自己的文档版本，可以通过环境变量指定：

{
  "mcpServers": {
    "m8-framework": {
      "command": "npx",
      "args": ["-y", "m8-framework-mcp"],
      "env": {
        "EJS_DOC_PATH": "/path/to/your/ejs-doc",
        "M8_DOC_PATH": "/path/to/your/m8mpdoc"
      }
    }
  }
}

全局安装

如果你希望全局安装而不是每次使用 npx：

npm install -g m8-framework-mcp

然后配置改为：

{
  "mcpServers": {
    "m8-framework": {
      "command": "m8-framework-mcp"
    }
  }
}

许可证

MIT