Dart/Flutter MCPへの接続・起動がうまくできない問題の解消
概要
FlutterプロジェクトでDart and Flutter MCP serverに接続につまづいた際の解消方法を記録します。
厳密には接続自体は行えていたのですがMCPの一部機能が待機状態になっていて利用できない状態でシバラウスタックしたのでその状態からの解消事案になります。
主にcodeXを中心としたvibe codingのため、同様の状況にいる初学者に届けば幸いです。
本業エンジニアの方も気になる部分や訂正がある場合は是正のほどお願いします。
参考：
つまづきポイント
1.Dart SDK 3.9以降への更新
初歩的すぎるのですが、まず自分はこれができていませんでした。
ドキュメントにも記載がある通りDart and Flutter MCPはDart SDK3.9以上が必須です。
The Dart and Flutter MCP server is experimental and likely to evolve quickly. The following instructions require Dart 3.9 or later.
公式ドキュメントをAIに渡した上で実施すればまず問題ないと思いますが、接続時点でつまづいた方はまずバージョンアプデを行いましょう。
2.DTD URIの提供
誤解①：3.9以上に更新されているが3.9以上のアプデを求められ続ける
MCPへの接続しただけではMCPの利用までは至ることができません。
おそらく各種コマンドを打っても以下のようにSDKのアップデートを求められ続けると思います。
It seems you need to update your Dart SDK. The required version is 3.9.0-163.0.dev or greater.
しかしここが難所で、ポイント1でアプデが完了しているはずなのでver3.9以上であれば適用条件は満たせています。
誤解②：DTD URIではなくVMサービスのURIを渡してしまう
flutter runでアプリを起動した際にVMサービスのURIおよびURLが提供されると思います。それを提供してもMCPは起動してくれません。自分はVMサービスのURIを渡し続けてしまっていてスタックしておりました。
解消方法
flutter run --print-dtdにてDTD URIを取得し、提供することが必要です。
DTD（Dart Tooling Daemon）は、Flutter/Dartアプリと外部開発ツールを接続するための「橋渡し役」となるデーモンプロセスです。これを通じて以下のようなことができます。
- アプリの状態をリアルタイムで取得
- ウィジェットツリーの構造を確認
- パフォーマンス情報の取得
- ホットリロードの制御
- デバッグ情報へのアクセス
flutter run --print-dtdにてprint-dtd オプションをつけると、コンソールに次のような接続URIが出力されます
The Dart Tooling Daemon is now listening on ws://127.0.0.1:56789/abcdef123456
このURIを使って、DartMCPやFlutter DevToolsなどの外部ツールがアプリに接続できるようになります。
通常の flutter run と実行内容は同じですが、外部ツールとの連携が必要な開発作業では --print-dtd を使うという使い分けをしましょう。
-
flutter run→ 普通に実行（DTD URIは表示されない） -
flutter run --print-dtd→ DTD URIを表示しながら実行（外部ツール連携用）
参照：
まとめ
Dart and Flutter MCP serverへ接続がうまくできない、または接続したけど起動してない場合は以下のプロセスを踏みましょう
- Dart SDKを3.9以上に更新
- flutter run --print-dtd を実行
- 出力されたDTD URIを取得
- そのURIを使ってDartMCPやDevToolsに接続
- アプリの詳細情報を取得しながら実装を進める
Discussion