Shoplazza MCP 工具

这是一个用于Cursor的MCP (Model Context Protocol) 工具，可以获取Shoplazza LessJS组件的文档信息。

功能

• 获取LessJS组件的完整文档
• 提取组件的属性、方法、事件和示例代码
• 提供结构化的JSON格式输出

安装和配置

1. 构建项目

npm install
npm run build

2. 在Cursor中配置MCP

在Cursor中，你需要配置MCP服务器。有两种方式：

方式一：通过Cursor设置界面

1. 打开Cursor
2. 进入设置 (Settings)
3. 搜索 "MCP" 或 "Model Context Protocol"
4. 添加新的MCP服务器配置：

{
  "command": "node",
  "args": ["/path/to/your/shoplazza-mcp/build/index.js"],
  "env": {}
}

方式二：通过配置文件

在你的Cursor配置目录中创建或编辑MCP配置文件：

macOS: ~/Library/Application Support/Cursor/User/globalStorage/mcp-config.json Windows: %APPDATA%\Cursor\User\globalStorage\mcp-config.json Linux: ~/.config/Cursor/User/globalStorage/mcp-config.json

{
  "mcpServers": {
    "shoplazza-mcp": {
      "command": "node",
      "args": ["/path/to/your/shoplazza-mcp/build/index.js"],
      "env": {}
    }
  }
}

3. 重启Cursor

配置完成后，重启Cursor以使MCP工具生效。

使用方法

配置完成后，你可以在Cursor的对话中直接使用以下工具：

get-lessjs

获取LessJS组件的文档信息。

参数:

• componentName (string): LessJS组件名称

使用示例:

请帮我获取spz-accordion组件的文档信息

返回数据:

• 组件名称和描述
• 使用场景
• 属性列表（名称、类型、默认值、是否必需）
• 方法列表（名称、参数）
• 事件列表
• 代码示例

支持的组件

目前支持所有在 https://lessjs.shoplazza.com/latest/components/ 上可用的组件，包括但不限于：

故障排除

1. 工具未响应: 确保路径正确且文件存在
2. 权限错误: 确保build/index.js有执行权限
3. 网络错误: 检查网络连接和API地址是否可访问

开发

项目结构

shoplazza-mcp/
├── src/
│   ├── index.ts          # MCP服务器主文件
│   └── extractor.ts      # HTML解析和数据提取
├── build/                # 编译后的文件
├── package.json
└── README.md

添加新功能

1. 在 src/index.ts 中添加新的工具定义
2. 在 src/extractor.ts 中添加相应的数据提取逻辑
3. 重新构建项目：npm run build
4. 重启Cursor