Flutter_mcp_2

开发 JavaScript

🚀 Flutter MCP Service v2.0

Flutter MCP Service v2.0 是一套先进的 Flutter 开发工具，它基于模型上下文协议（MCP）构建，具备智能缓存、令牌管理功能，并集成了官方文档，能显著提升 Flutter 开发的效率和质量。

🚀 快速开始

安装

# 克隆仓库
git clone https://github.com/dvillegastech/flutter_mcp_2.git
cd flutter_mcp_service

# 安装依赖
npm install

# 初始化缓存
mkdir -p .cache

# 运行健康检查
npm run health-check

# 启动服务
npm start

与 Claude Desktop / Cursor 集成

将以下内容添加到你的 MCP 配置文件中：

{
"mcpServers": {
"flutter-mcp": {
"command": "node",
"args": ["/absolute/path/to/flutter_mcp_service/src/index.js"]
}
}
}

📋 完整工具列表及命令

🆕 统一工具（v2.0）

1. flutter_status

检查服务健康状况和缓存统计信息。

@flutter-mcp use flutter_status to check service health

2. flutter_search

在 Flutter/Dart 文档、包和示例中进行通用搜索。

@flutter-mcp use flutter_search with query "Container" and limit 5
@flutter-mcp use flutter_search to find ListView examples

参数：

query（必需）：搜索词
limit（可选）：最大结果数（默认：10）
maxTokens（可选）：响应大小限制（默认：4000）

3. flutter_analyze

智能的 Flutter 文档获取器和代码分析器。

@flutter-mcp use flutter_analyze with identifier "Container"
@flutter-mcp use flutter_analyze with identifier "Container" and this code:
Container(
width: 100,
height: 100,
color: Colors.blue,
)

参数：

identifier（必需）：小部件/类名或包名
code（可选）：要分析的代码
topic（可选）："all", "docs", "analysis", "examples"（默认："all"）
maxTokens（可选）：响应大小限制
includeExamples（可选）：包含代码示例（默认：true）
includeAnalysis（可选）：包含代码分析（默认：true）

🔧 旧版工具（向后兼容）

4. analyze_widget

分析 Flutter 小部件代码的最佳实践、性能和可访问性。

@flutter-mcp use analyze_widget with this widgetCode:
class MyWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
child: Text('Hello World'),
);
}
}

参数：

widgetCode（必需）：Flutter 小部件代码
checkAccessibility（可选）：检查可访问性（默认：true）
checkPerformance（可选）：检查性能（默认：true）

5. validate_flutter_docs

根据官方 Flutter 文档验证代码。

@flutter-mcp use validate_flutter_docs with this code:
Container(
color: Colors.red,
decoration: BoxDecoration(color: Colors.blue), // This will be flagged
)

参数：

code（必需）：Flutter/Dart 代码
widgetType（可选）：要关注的特定小部件

6. analyze_pub_package

分析 pub.dev 上的包的质量和兼容性。

@flutter-mcp use analyze_pub_package with packageName "provider"
@flutter-mcp use analyze_pub_package with packageName "dio" and checkDependencies true

参数：

packageName（必需）：pub.dev 上的包名
checkDependencies（可选）：分析依赖项（默认：true）
checkScores（可选）：获取 pub.dev 评分（默认：true）

7. suggest_improvements

根据 Flutter 最佳实践获取改进建议。

@flutter-mcp use suggest_improvements for this code:
ListView(
children: List.generate(1000, (i) => Text('Item $i')),
)

参数：

code（必需）：Flutter 代码
focusArea（可选）："performance", "accessibility", "maintainability", "all"

8. analyze_performance

分析 Flutter 小部件树的性能问题。

@flutter-mcp use analyze_performance with this widgetTree:
Column(
children: [
for (int i = 0; i < 100; i++)
Container(child: Text('Item $i')),
],
)

参数：

widgetTree（必需）：小部件树代码
checkRebuildOptimization（可选）：检查重建优化（默认：true）
checkMemoryLeaks（可选）：检查内存泄漏（默认：true）

9. analyze_architecture

分析项目架构的合规性。

@flutter-mcp use analyze_architecture with projectStructure {
"lib": {
"features": ["auth", "home", "profile"],
"core": ["network", "database"],
"shared": ["widgets", "utils"]
}
} and pattern "clean"

参数：

projectStructure（必需）：项目目录结构
pattern（可选）："clean", "mvvm", "mvc", "auto"
checkDependencies（可选）：检查依赖项违规（默认：true）

10. analyze_bundle_size

分析应用程序包大小并提供优化建议。

@flutter-mcp use analyze_bundle_size with buildPath "/path/to/build" and platform "android"

参数：

buildPath（必需）：构建输出路径
platform（可选）："android", "ios", "web", "all"
includeAssets（可选）：包含资产分析（默认：true）

11. generate_tests

生成全面的 Flutter 测试。

@flutter-mcp use generate_tests for this widgetCode:
class CounterButton extends StatelessWidget {
final VoidCallback onPressed;
final int count;

const CounterButton({required this.onPressed, required this.count});

@override
Widget build(BuildContext context) {
return ElevatedButton(
onPressed: onPressed,
child: Text('Count: $count'),
);
}
}

参数：

widgetCode（必需）：小部件代码
testType（可选）："unit", "widget", "integration", "golden", "all"
includeAccessibility（可选）：包含可访问性测试（默认：true）

12. trace_state

跟踪 Flutter 小部件中的状态流和重建。

@flutter-mcp use trace_state with this widgetCode:
class MyStatefulWidget extends StatefulWidget {
// ... widget code
}

参数：

widgetCode（必需）：小部件代码
traceRebuildPaths（可选）：跟踪重建路径（默认：true）
generateVisualization（可选）：生成可视化（默认：true）

13. generate_clean_architecture

生成干净架构结构。

@flutter-mcp use generate_clean_architecture with projectName "todo_app" and features ["auth", "todos", "settings"]

参数：

projectName（必需）：项目/功能名称
features（必需）：功能列表
stateManagement（可选）："riverpod", "bloc", "provider", "getx"
includeDI（可选）：包含依赖注入（默认：true）

14. generate_l10n

使用 ARB 文件生成本地化设置。

@flutter-mcp use generate_l10n with languages ["en", "es", "fr"]

参数：

languages（必需）：要支持的语言代码
translations（可选）：初始翻译
includeRTL（可选）：包含 RTL 支持（默认：true）
includePluralization（可选）：包含复数形式（默认：true）

15. monitor_performance

生成性能监控设置。

@flutter-mcp use monitor_performance with monitoringType "balanced"

参数：

monitoringType（必需）："comprehensive", "balanced", "lightweight"
includeNetwork（可选）：监控网络（默认：true）
includeMemory（可选）：监控内存（默认：true）
includeAnalytics（可选）：包含分析（默认：true）

16. diagnose_render_issues

诊断和修复渲染问题。

@flutter-mcp use diagnose_render_issues with this widgetCode:
Row(
children: [
Expanded(child: Text('Long text')),
Container(width: double.infinity), // This will cause issues
],
)

参数：

widgetCode（必需）：有问题的小部件代码
errorType（可选）："overflow", "constraint", "layout", "all"
includeVisualization（可选）：包含调试可视化（默认：true）

17. analyze_test_coverage

分析测试覆盖率并提供建议。

@flutter-mcp use analyze_test_coverage with coverageData {...} and targetCoverage 80

参数：

coverageData（必需）：来自 lcov 的覆盖率数据
projectStructure（必需）：项目文件结构
targetCoverage（可选）：目标覆盖率百分比（默认：80）
generateReport（可选）：生成可视化报告（默认：true）

💻 使用示例

基础小部件分析

@flutter-mcp analyze this Flutter widget for issues:
Container(
child: Column(
children: List.generate(100, (i) => Text('Item $i')),
),
)

包研究

@flutter-mcp search for "state management" packages and analyze the top result

性能优化工作流

1. @flutter-mcp analyze_performance for my widget tree
2. @flutter-mcp suggest_improvements based on performance issues
3. @flutter-mcp generate_tests for the optimized code

完整项目分析

@flutter-mcp analyze_architecture for my project and suggest clean architecture improvements

🔧 开发命令

# 开发模式，支持自动重新加载
npm run dev

# 运行测试
npm test
npm run test:integration
npm run test:coverage

# 健康检查
npm run health-check

# 代码检查和格式化
npm run lint
npm run format

# Docker 相关
npm run build:docker
npm run docker:run

# 清理缓存
npm run clean

✨ 主要特性

智能缓存：采用 SQLite 与内存缓存结合，并设置了 TTL（Time-To-Live）。
令牌管理：使用 GPT - 3 编码器进行智能截断。
错误处理：采用断路器模式和重试逻辑。
速率限制：合理使用 API（每秒 2 次请求）。
官方文档集成：实时集成 Flutter/Dart 官方文档。
多平台支持：支持 npm、Docker 和直接安装。
健康监控：内置健康检查和统计功能。

🏗️ 架构

详细的架构文档请参考 docs/ARCHITECTURE.md。

🤝 贡献

开发指南请参考 docs/DEVELOPMENT.md。

📄 许可证

本项目采用 MIT 许可证，详情请查看 LICENSE 文件。

🙏 致谢

感谢 Flutter 团队提供的优秀文档。
感谢 MCP SDK 的贡献者们。
灵感来源于 adamsmaka/flutter - mcp。

为 Flutter 社区用心打造 ❤️

0 条评论
分类：开发