Fire in da houseTop Tip:Paying $100+ per month for Perplexity, MidJourney, Runway, ChatGPT and other tools is crazy - get all your AI tools in one site starting at $15 per month with Galaxy AI Fire in da houseCheck it out free

mcp_flutter

MCP.Pizza Chef: Arenukvern

mcp_flutter is an MCP server designed for the Dart VM and Flutter framework, enabling seamless integration of Flutter applications with AI coding assistants like Cursor, Claude, and others. It facilitates real-time context sharing and interaction between Flutter apps and AI tools, streamlining AI-powered development workflows and debugging.

Use This MCP server To

Integrate Flutter apps with AI coding assistants for real-time code insights Enable AI-driven debugging and inspection of Flutter applications Streamline Flutter development with AI-powered code suggestions Connect Flutter development environment to multiple AI assistants via MCP Facilitate real-time context sharing between Flutter apps and AI tools

README

Flutter Inspector MCP Server for AI-Powered Development

GitHub Repository smithery badge

πŸ” Model Context Protocol (MCP) server that connects your Flutter apps with AI coding assistants like Cursor, Claude, Cline, Windsurf, RooCode or any other AI assistant that supports MCP server

See small video tutorial how to setup mcp server on macOS with Cursor - https://www.youtube.com/watch?v=NBY2p7XIass

Flutter Inspector Server MCP server

Note

Since there is a new experimental package in development which exposes Dart tooling development tool actions to clients, maybe in future this project may be not needed that much.

Therefore my current focus is

  1. to stabilize and polish only these tools that will be useful in development (so it would be more plug & play) see more in MCP_RPC_DESCRIPTION.md
  2. find workaround to not use forwarding server.

Hope it will be useful for you,

Have a nice day!

Currently Flutter works with MCP server via forwarding server. Please see Architecture for more details.

⚠️ WARNING ⚠️

Dump RPC methods (like dump_render_tree), may cause huge amount of tokens usage or overload context. Therefore now they are disabled by default, but can be enabled via environment variable DUMPS_SUPPORTED=true.

See more details about environment variables in .env.example.

πŸš€ Getting Started

🎯 Available tools for AI Agents

Error Analysis

  • get_app_errors [Resource|Tool] - Retrieves precise and condensed error information from your Flutter app Usage:

    • Uses only short description of the error. Should filter duplicate errors, to avoid flooding Agent context window with the same errors.
    • Uses Error Monitor to capture Dart VM errors. Meaning: first, start mcp server, forwarding server, start app, open devtools and extension, and then reload app, to capture errors. All errors will be captured in the DevTools Extension (mcp_bridge).

    Tested on: βœ… macOS, βœ… iOS Not tested on: 🚧 Android, πŸ€” Windows, πŸ€” Linux, ❌ Web See issue

Development Tools

  • hot_reload [Tool] - Performs hot reload of the Flutter application Tested on: βœ… macOS, βœ… iOS, βœ… Android Not tested on: πŸ€” Windows, πŸ€” Linux, ❌ Web See issue

  • screenshot [Resource|Tool] - Captures a screenshot of the running application. Configuration:

    • Enable with --images flag or IMAGES_SUPPORTED=true environment variable
    • May use compression to optimize image size

    Tested on: βœ… macOS, βœ… iOS Not tested on: 🚧 Android, πŸ€” Windows, πŸ€” Linux, ❌ Web See issue

All tools default to using port 8181 if no port is specified. You can override this by providing a specific port number.

πŸ“š Please see more in MCP_RPC_DESCRIPTION

πŸ”§ Troubleshooting

get_app_errors- Since errors are captured in DevTools Extension, you need to make sure that, you have restarted or reloaded Flutter app after starting MCP server, forwarding server and DevTools mcp_bridge extension.

Also make sure you:

  1. Verify that forwarding server is running.

  2. Opened Devtools in Browser.

  3. Have added MCP extension to your Flutter app dev dependencies and enabled it in Devtools.

  4. Connection Issues

    • Ensure your Flutter app is running in debug mode
    • Verify the port matches in both Flutter app and inspector
    • Check if the port is not being used by another process
  5. AI Tool Not Detecting Inspector

    • Restart the AI tool after configuration changes
    • Verify the configuration JSON syntax
    • Check the tool's logs for connection errors

🚧 Smithery Integration 🚧 (work in progress)

The Flutter Inspector is registered with Smithery's registry, making it discoverable and usable by other AI tools through a standardized interface.

Integration Architecture

β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”     β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”     β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”     β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”     β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”
β”‚                 β”‚     β”‚              β”‚     β”‚              β”‚     β”‚                 β”‚     β”‚             β”‚
β”‚  Flutter App    β”‚<--->β”‚  DevTools    β”‚<--->β”‚  Forwarding  β”‚<--->β”‚   MCP Server   β”‚<--->β”‚  Smithery   β”‚
β”‚  (Debug Mode)   β”‚     β”‚  Extension   β”‚     β”‚  Server      β”‚     β”‚   (Registered) β”‚     β”‚  Registry   β”‚
β”‚                 β”‚     β”‚              β”‚     β”‚              β”‚     β”‚                 β”‚     β”‚             β”‚
β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜     β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜     β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜     β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜     β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜

🀝 Contributing

Contributions are welcome! Please feel free to submit pull requests or report issues on the GitHub repository.

πŸ“– Learn More

πŸ“„ License

MIT - Feel free to use in your projects!


Flutter and Dart are trademarks of Google LLC.

mcp_flutter FAQ

How do I set up mcp_flutter on my development machine?
You can follow the video tutorial for macOS setup available at https://www.youtube.com/watch?v=NBY2p7XIass, and refer to the GitHub repository for detailed instructions.
Which AI coding assistants are compatible with mcp_flutter?
mcp_flutter supports any AI assistant that implements the MCP server protocol, including Cursor, Claude, Cline, Windsurf, and RooCode.
Can mcp_flutter be used with non-Flutter Dart projects?
While primarily designed for Flutter, mcp_flutter targets the Dart VM, so it may support Dart projects, but its main focus is Flutter app integration.
Is mcp_flutter actively maintained and supported?
The project is active, but there is an experimental Dart tooling MCP server package in development that may offer overlapping features in the future.
Does mcp_flutter support multiple AI assistants simultaneously?
Yes, it can connect Flutter apps to multiple AI assistants that support the MCP server protocol.
What platforms does mcp_flutter support?
It supports platforms where Dart VM and Flutter run, including macOS, Windows, and Linux.
How does mcp_flutter improve Flutter development workflows?
By enabling AI assistants to inspect, analyze, and interact with Flutter apps in real time, it enhances debugging, code suggestions, and development speed.