Flutter Inspector MCP Server for AI-Powered Development - MCP服务，MCP服务器，MCP教程

基本能力

产品定位

Flutter Inspector MCP Server 是一个专为Flutter开发者设计的工具，旨在通过AI辅助提升开发效率，特别是在调试和UI分析方面。

核心功能

• Widget树分析：获取Flutter应用结构的详细信息。
• 导航检查：查看当前路由和导航状态。
• 布局问题调试：理解widget之间的关系和属性。
• 截图功能：获取Flutter应用的当前屏幕截图。
• 根widget获取：获取应用的根widget信息。

适用场景

• Flutter应用的开发和调试。
• 需要AI辅助进行代码分析和优化的场景。
• 需要快速获取应用UI结构和状态的场景。

工具列表

• Utility Methods：如get_active_ports、get_supported_protocols等，用于辅助功能。
• Debug Methods：如debug_dump_render_tree、debug_dump_layer_tree等，用于调试。
• Inspector Methods：如inspector_screenshot，用于检查UI。
• DartIO Methods：如dart_io_get_version，用于获取Dart相关信息。

常见问题解答

• 连接问题：确保Flutter应用在调试模式下运行，并检查端口匹配。
• AI工具未检测到Inspector：重启AI工具，检查配置JSON语法。

使用教程

使用依赖

• Node.js (v14或更高版本)
• 运行在调试模式的Flutter应用
• 支持AI助手（如Cursor、Claude或Cline）

安装教程

通过Smithery安装

bash
npx -y @smithery/cli install @Arenukvern/mcp_flutter --client claude

从GitHub安装

1. 克隆仓库
   bash
git clone https://github.com/Arenukvern/mcp_flutter
cd flutter-inspector
2. 安装并构建依赖
   bash
make install
3. 启动转发服务器
   bash
make forward
4. 添加DevTools Flutter扩展
   bash
flutter pub add --dev devtools_mcp_extension
5. 启动Flutter应用
   bash
flutter run --debug --observatory-port=8181 --enable-vm-service --disable-service-auth-codes

调试方式

• 确保Flutter应用在调试模式下运行。
• 检查端口配置是否正确。
• 使用提供的工具方法进行调试和分析。