快速开始

安装

VueSage MCP 服务安装:

使用 npx(推荐)

无需安装,直接在配置中使用:

{
  "mcpServers": {
    "vuesage": {
      "command": "npx",
      "args": [
        "vuesage-mcp@1.0.9"
      ],
      "enabled": true,
      "env": {}
    }
  }
}

全局安装

如果你想安装到全局:

npm install -g vuesage-mcp@1.1.44

Cursor 编辑器配置

1. 配置 MCP

~/.cursor/mcp.json 文件中添加:

{
  "mcpServers": {
    "vuesage": {
      "command": "vuesage-mcp",
      "version": "1.1.44",
      "enabled": true,
      "capabilities": {
        "tools": [
          {
            "name": "analyze",
            "description": "分析Vue组件代码质量",
            "parameters": {
              "type": "object",
              "properties": {
                "component": {
                  "type": "string",
                  "description": "Vue组件代码"
                }
              },
              "required": ["component"]
            }
          }
        ]
      }
    }
  }
}

2. 使用方式

在 Cursor 编辑器中,你可以:

  • 使用命令:/analyze - 分析当前 Vue 组件
  • 或直接输入自然语言指令:如 "分析当前组件" 等

分析结果说明

分析结果包含以下信息:

{
  "score": 95,        // 代码质量得分
  "issues": 0,        // 严重问题数量
  "warnings": 1,      // 警告数量
  "details": [        // 详细问题列表
    {
      "type": "warning",
      "message": "具体的问题描述",
      "line": 16      // 问题所在行号
    }
  ]
}

调试模式

如果需要查看详细日志,可以设置环境变量:

export VUESAGE_DEBUG=true

日志文件位置:~/.vuesage/logs/vuesage.log

下一步

了解更多信息: