search
LoginSignup
6

More than 1 year has passed since last update.

posted at

updated at

VSCodeでFlutterのHot Reloadを体感するにはDebug modeでの起動が必要である

タイトルに尽きるのですが。

公式のドキュメントにきちんと言及されている通り、Only Flutter apps in debug mode can be hot reloaded., デバッグモードの場合にのみHot Reloadが有効になります。

つまり、flutter runでは Hot Reload が有効にはならないので悪しからずということです。
フロントエンド人としては普通にwebpack-dev-servernpm run startなどに設定することが多いので、そのノリでイケると勘違いしていました。そのせいで少しの時間ロスしたので、一応ここにメモっておくことにしました。

VSCode の Debug Mode で Flutter アプリを立ち上げる

VSCodeとiOS Simulatorでの使用を想定しています。iOS Simulatorは起動済みとします。

cmd + shift + Pまたは"View" => "Command Palette"よりコマンドパレット開いて、flutterと入力。

Debug: Attach to Flutter on Deviceがあるので、選択。少々時間のかかるビルドを待つ。

以上で、Hot Reloadができます。はい

関係ないですが、WEBフロントから来た身からすると、Flutter起動時のビルド遅くねってなってます。なんとかならんのかねこれ

追記: VSCodeのDebugモードの画面(左の虫アイコン or cmd + shift + D)からRun with Dart and Flutterを実行してもデバッグモードで実行できるようです。体感ですが、こっちの方がビルド速い??

ref

https://flutter.dev/docs/development/tools/hot-reload
https://stackoverflow.com/questions/55060461/vs-code-osx-flutter-hot-reload-is-not-triggered-by-save

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
6