MCP Flutter Livekit Team

MCP： mcp-flutter-livekit-team

一个全面的模型上下文协议（MCP）服务器，集成了发现、UI/UX生成、Flutter/Dart工具、LiveKit工具和团队协作以及Cursor多代理的并行执行计划。

特性

• 探索舱：趋势→ 想法→ 病毒性评分→ 选择
• UI/UX生成器：基于文本的布局描述、线框生成和样式
• 颤振/飞镖工具：项目创建、依赖关系管理、格式化和分析
• LiveKit工具：文档搜索和示例获取
• 团队协作：架构规划、代码审查、QA测试规划和LiveKit集成脚手架
• 平行规划：为Cursor多代理执行生成可并行化的任务计划

先决条件

• Node.js 18+和npm
• TypeScript 知识（用于开发/修改）
• 光标 IDE（用于MCP集成）
• 飘动 （可选，用于使用Flutter工具）

安装

第一步：克隆或下载

如果您有项目文件，请导航到项目目录：

cd mcp-flutter-livekit-team

步骤2：安装依赖项

npm install

这将安装：

• @modelcontextprotocol/sdk -MCP SDK
• TypeScript和相关的开发依赖关系

步骤3：构建项目

npm run build

这将TypeScript编译为JavaScript dist/ 文件夹。

步骤4：验证安装

测试服务器是否正确启动：

npm start

您应该看到：

MCP Flutter LiveKit Team server running on stdio

按 Ctrl+C 停止服务器。

光标中的配置

步骤1：找到MCP配置文件

打开Cursor MCP配置文件：

窗户：

%APPDATA%\Cursor\User\globalStorage\mcp.json

或者直接：

C:\Users\YOUR_USERNAME\.cursor\mcp.json

macOS：

~/Library/Application Support/Cursor/User/globalStorage/mcp.json

Linux：

~/.config/Cursor/User/globalStorage/mcp.json

步骤2：添加服务器配置

将以下条目添加到 mcpServers 对象在你 mcp.json 文件：

{
  "mcpServers": {
    "flutter-livekit-team": {
      "type": "stdio",
      "command": "node",
      "args": [
        "D:\\FluterLivekitApps\\Test\\mcp-flutter-livekit-team\\dist\\index.js"
      ],
      "env": {}
    }
  }
}

重要提示： 替换中的路径 args 随着 绝对路径 你的 dist/index.js 文件。

Windows示例：

"args": [
  "D:\\FluterLivekitApps\\Test\\mcp-flutter-livekit-team\\dist\\index.js"
]

macOS/Linux示例：

"args": [
  "/Users/yourname/projects/mcp-flutter-livekit-team/dist/index.js"
]

步骤3：重新启动游标

1. 完全关闭光标
2. 重新打开光标
3. MCP服务器将在需要时自动启动

步骤4：验证连接

1. 打开光标的MCP面板（通常可通过命令面板访问）
2. 你应该看看 flutter-livekit-team 列为可用服务器
3. 所有工具应可见且可访问

用法

发现工作流程

从发现趋势和产生想法开始：

// 1. Fetch trend buckets
discovery.trends.fetch()

// 2. Generate ideas from trends
discovery.ideas.generate({ buckets: [...] })

// 3. Enhance ideas with variants
discovery.ideas.build_on_top({ ideas: [...] })

// 4. Score ideas for virality
discovery.ideas.score_virality({ ideas: [...] })

// 5. Pick the best idea(s)
discovery.ideas.pick({ ranked: [...], mode: "single" })

UI/UX生成工作流

生成UI规范和Flutter小部件：

// 1. Describe the layout
uiux.layout.describe({
  ideaId: "idea-1",
  coreActions: ["join room", "send message"],
  personas: ["creator", "viewer"]
})

// 2. Generate wireframe code
uiux.wireframe.generate({ layout: {...} })

// 3. Apply styling
uiux.style.apply({ widgets: [...], theme: "light" })

外观套件设置（创意选择后）

如果需要，设置ApparenceKit模板：

// Setup ApparenceKit template
apparencekit.setup({
  useApparenceKit: true,
  projectPath: "./my_app",
  githubToken: "your_github_token",
  backendType: "firebase", // or "supabase" or "rest"
  projectName: "my_app"
})

建筑规划

规划你的应用程序架构：

// Generate architecture and task list
team.architect.plan({ idea: selectedIdea })

// Create parallel execution plan
cursor.plan.parallel({
  tasks: architectureTasks,
  maxAgents: 4
})

Flutter项目设置

// Create Flutter project
flutter.project.create({ name: "my_app", org: "com.example" })

// Add dependencies
flutter.pub.add({ package: "livekit_client", version: "latest" })

代码质量

// Format code
dart.format({ code: "..." })

// Analyze code
dart.analyze({ code: "..." })

// Review code
team.lead.review({ code: "...", language: "dart" })

LiveKit集成

// Search documentation
livekit.docs.search({ query: "room connection" })

// Fetch examples
livekit.example.fetch({ topic: "room", language: "dart" })

// Scaffold integration files
team.integrator.flutter_livekit_scaffold({
  projectPath: "./my_app",
  projectName: "my_app"
})

可用工具

发现工具(discovery.*)

• discovery.trends.fetch -获取预定义的趋势桶
• discovery.ideas.generate -根据趋势产生5-8个想法
• discovery.ideas.build_on_top -用变体增强想法
• discovery.ideas.score_virality -对想法进行评分和排名
• discovery.ideas.pick -选择最佳创意（单模式或双模式）

UI/UX工具(uiux.*)

• uiux.layout.describe -描述屏幕、小部件和导航
• uiux.wireframe.generate -生成Flutter小部件骨架
• uiux.style.apply -将主题和样式应用于小部件

Flutter工具(flutter.*)

• flutter.project.create -创建新的Flutter项目
• flutter.pub.add -向pubspec.yaml添加依赖项

飞镖工具(dart.*)

• dart.format -格式化Dart代码
• dart.analyze -分析Dart代码中的错误

LiveKit工具(livekit.*)

• livekit.docs.search -搜索LiveKit文档
• livekit.example.fetch -获取LiveKit代码示例

团队工具(team.*)

• team.architect.plan -生成应用程序架构和任务列表
• team.lead.review -审查代码并提供修复
• team.qa.testplan -创建测试场景
• team.integrator.flutter_livekit_scaffold -设置LiveKit集成文件

光标工具(cursor.*)

• cursor.plan.parallel -将任务列表转换为并行可执行计划

ApparenceKit工具(apparencekit.*)

• apparencekit.setup -在Flutter项目中设置ApparenceKit模板。询问用户是否要使用ApparenceKit，如果是，请按照文档安装和配置它

发展

项目结构

mcp-flutter-livekit-team/
├── src/
│   ├── index.ts                 # Main entry point
│   └── tools/
│       ├── discovery/           # Discovery tools
│       ├── uiux/                # UI/UX tools
│       ├── flutter/             # Flutter tools
│       ├── dart/                # Dart tools
│       ├── livekit/             # LiveKit tools
│       ├── team/                # Team collaboration tools
│       ├── cursor/              # Cursor planning tools
│       └── apparencekit/        # ApparenceKit setup tools
├── dist/                        # Compiled JavaScript
├── package.json
├── tsconfig.json
└── README.md

建筑

# Build TypeScript
npm run build

# Development mode (with ts-node)
npm run dev

添加新工具

1. 在适当的工具目录中创建新文件（例如。， src/tools/discovery/)
2. 导出工具定义和处理函数
3. 注册 src/index.ts
4. 重建： npm run build

故障排除

服务器未启动

错误：“无法读取package.json”

• 解决方案：使用 node 直接代替 npm start 在MCP配置中
• 使用绝对路径 dist/index.js 在 args 数组

错误：“找不到服务器信息”

• 解决方案：更新后重新启动游标 mcp.json
• 验证中的路径 args 正确（使用双反斜杠 \\ 在Windows上）

工具未出现

1. 检查Cursor的MCP服务器状态面板
2. 验证服务器是否已列出并正在运行
3. 检查Cursor的开发人员控制台是否有错误
4. 确保构建成功完成(dist/ 文件夹存在）

构建错误

TypeScript编译错误：

# Clean and rebuild
rm -rf dist node_modules
npm install
npm run build

路径问题（Windows）

在Windows路径中始终使用双反斜杠：

"D:\\FluterLivekitApps\\Test\\mcp-flutter-livekit-team\\dist\\index.js"

或者使用正斜杠（也适用于Windows）：

"D:/FluterLivekitApps/Test/mcp-flutter-livekit-team/dist/index.js"

代理角色

看 代理商.md 有关代理角色和工具映射的详细信息。

许可证

麻省理工学院

贡献

这是一个自定义MCP服务器。修改中的工具实现 src/tools/ 根据您的需求定制行为。

支持

对于以下问题：

• MCP协议：检查 模型上下文协议文档
• 光标集成：检查Cursor的MCP文档
• 此服务器：查看中的代码 src/tools/ 并根据需要进行修改