README.md•2.59 kB
# Shoplazza MCP 工具
这是一个用于Cursor的MCP (Model Context Protocol) 工具，可以获取Shoplazza LessJS组件的文档信息。
## 功能
- 获取LessJS组件的完整文档
- 提取组件的属性、方法、事件和示例代码
- 提供结构化的JSON格式输出
## 安装和配置
### 1. 构建项目
```bash
npm install
npm run build
```
### 2. 在Cursor中配置MCP
在Cursor中，你需要配置MCP服务器。有两种方式：
#### 方式一：通过Cursor设置界面
1. 打开Cursor
2. 进入设置 (Settings)
3. 搜索 "MCP" 或 "Model Context Protocol"
4. 添加新的MCP服务器配置：
```json
{
"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`
```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