VSCode hot reload for Flutter does not work

Question

I'm on VSCode right now working on my flutter application when hot reload just stops working, right in the middle of my development. I have absolutely no idea why this happens, I had no issue with this before at all in the past. If it helps anyone, I'm working on the second page of my app, which you get to via a route on the first page. Is this why hot reload isn't working? If it isn't can someone tell me why it doesn't work? This is really annoying and hindering progress on my app. Thanks!

Restarting my computer, and restarting the debugging. I'm on a Macbook Pro 2015 running macOS Mojave Version 10.14.2 if that helps.

There isn't really any code to show, it's not code related. It's VSCode or Flutter.

I expect the hot reload to work, but it doesn't.

Is this serious enough to fill out an issue form? It seems like this is probably a minor issue and I haven’t seen others bring this up — Michael Brennan, Jan 21 '19 at 05:56
Personally I use Android Studio, so can't tell much about this issue. Let's wait for someone else coming up with a solution. — CopsOnRoad, Jan 21 '19 at 06:03
This happen also to me also, better you fill on bug on github. It start happen yesterday, seems after call 'flutter upgrade'. — Apin, Jan 21 '19 at 07:41
Try to use `flutter clean` before compiling. Then try again the hot reload feature. Might fix your issue — Arendhal, Jan 21 '19 at 07:56
Same issue, I'm debugging in iOS Simulator, so it can't be Android Studio problem, right? — Goon Nguyen, Mar 11 '19 at 09:01
Android Studio users watch this: https://www.youtube.com/watch?v=WiujjJxLGIk — aderchox, Dec 01 '19 at 19:16

THE_BLESSED_MEDIUM · Answer 1 · 2019-12-08T15:14:40.617

47

The hot reload doesn't work if you launch your app using f5 or select start debugging from the dropdown of debug .

But if you launch your app using Ctrl+f5 or select start without debugging from the dropdown of debug .

To solve the issue first close the running debugging session using Shift+f5.

Then click debug from the menu bar. Click Start without debugging.

Now The Hot reload works perfectly fine.

You can do the hot reload also using terminal. Just type: flutter run in the terminal and the app will be launched.

just press r in the terminal and hot reload will be initialized.

edited Dec 08 '19 at 15:14

answered Dec 08 '19 at 12:55

THE_BLESSED_MEDIUM

886
7
12

It did work for me - Sept 2021 – tonhozi Sep 19 '21 at 13:56
Thank you a lot, it works - Oct 2021 – BraveVN Oct 13 '21 at 15:27
1

Not working anymore, Feb 2022 – Nitish Kumar Diwakar Feb 19 '22 at 14:59
1

On Mac, I discovered that I need to launch from VS Code (using Run > Start Debugging, or F5) rather than using 'Flutter run' in Terminal. Hot reload will not work when saving in VS Code if I start from Terminal. – RonH Jun 02 '23 at 08:26

score 40 · Answer 2 · answered May 04 '21 at 14:08

40

I have noticed that hot reload is not working if you in runApp directly pass in MaterialApp. If separate core widget is created than everything works properly.

Working example:

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Hot reload works!!')),
      ),
    );
  }
}

Not working:

void main() => runApp(MaterialApp(
  home: Scaffold(
    appBar: AppBar(title: Text('Hot reload not working')),
  ),
));

Also don't forget to enable hot reload on save: https://stackoverflow.com/a/67132314/4990406

answered May 04 '21 at 14:08

sidnas

425
5
12

See @moaaz.m.f's answer above for details on enabling hot reload on save in vscode – Leland Reardon May 24 '23 at 17:14
@LelandReardon The problem here is because the "main" function runs only once and the hot reload doesn't run the main function or something else because hot reloading was enabled in both examples – sidnas May 25 '23 at 12:32
Agreed, and your answer worked for me :) Hot reloading apparently doesn't rerun main. Just wanted to reference the above tip, as I found it useful in combination with your solution. – Leland Reardon May 25 '23 at 17:00

moaaz.m.f · Answer 3 · 2022-06-12T08:50:10.077

26

if you are still facing this issue

open VS code then go to:

File > Preferences > Settings
in the search field type "Hot Reload"
you will see "Flutter Hot Reload On Save" and options are there
the default is "manual" so change it to "all" or "always"

Update - 12/Jun/2022 : instead of "always" the option now is = "All"

edited Jun 12 '22 at 08:50

answered Apr 16 '21 at 21:18

moaaz.m.f

291
3
6

score 9 · Answer 4 · answered Jun 22 '20 at 17:37

9

For VS Code Go to File>Autosave Make sure you have "check" Autosave.

answered Jun 22 '20 at 17:37

AARON TANG

99
1
1

This helped me. (Y) – Anmol Aug 30 '20 at 18:33
helped me too, but it is unncessarily reloading all the time code changes – Bensal Nov 28 '20 at 05:20

score 8 · Answer 5 · answered Jun 19 '21 at 16:23

Quoting here the answer of sidnas

I have noticed that hot reload is not working if you in runApp directly pass in MaterialApp. If separate core widget is created than everything works properly.

Working example:
void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Hot reload works!!')),
      ),
    );
  }
}
Not working:
void main() => runApp(MaterialApp(
  home: Scaffold(
    appBar: AppBar(title: Text('Hot reload not working')),
  ),
));

The reason why the second snippet prevents the hot reload from working is because the "main" only runs once and the hot reload doesn't run the main. So to make it work, you have to separate the MaterialApp to a different widget.

Thank you for making it clear on why it doesn't work. – DannyThunder Sep 30 '21 at 12:59 — DannyThunder, Sep 30 '21 at 12:59

score 6 · Answer 6 · answered May 10 '20 at 02:37

6

For me on the latest VS studio, pressing CRTL+s does the hot reload nicely for me. kinda a habbit from other IDE's.

answered May 10 '20 at 02:37

lolbardsnin

305
1
4
14

Also, a note i dont bother using the cmd – lolbardsnin May 10 '20 at 02:38
Why does this work ? I was repeatedly pressing CTRL + F5 and clicking the hot reload button. – Sharp Edge Jul 26 '20 at 20:26
1

i wish i could tell you, i havnt been using flutter for awhile as i've been tied up with other work. if i were to make an educated guess some IDE's wont build the current build till you save it, usually denoted with an astrix on the top corner of the tab you're working on. so once you save it, it may automatically compile and build it, but im also guessing these a wacky bug in the mix as i did initially try what they suggested and it didnt work – lolbardsnin Aug 30 '20 at 22:03

Ademar Salomão · Answer 7 · 2019-11-01T13:46:47.767

I found a way to force the hot reload in VS Code, which is very useful for those stuck in this situation: after the application is running, simply click on the debug option at the bottom of the VS Code editor whem the button is already named "Flutter" and, after choosing "flutter" again at the "Debug Configuraion" top floating window, you will be notified that the application is already being debugged, but the hot reload will occur.

score 2 · Answer 8 · answered May 30 '20 at 14:19

2

first save your project then hot reload it.

answered May 30 '20 at 14:19

Junaid Hassan Final

307
1
2
11

score 1 · Answer 9 · 2019-03-13T08:20:48.520

1

This appears to be a vscode issue in version 1.32.1 - see https://github.com/flutter/flutter/issues/29275 and https://github.com/Dart-Code/Dart-Code/issues/1518

In the meantime, you could revert to 1.31, wait for a fix in the next version, install the insiders version (which includes a fix), or could use 'flutter run' from the vscode terminal.

edited Mar 13 '19 at 08:20

answered Mar 13 '19 at 08:15

score 1 · Answer 10 · answered May 15 '20 at 16:24

Here are the official documented cases where hot reload wont work:

Data regarding the sate of the app is changed (since Flutter tries to maintain the state of your app between hot reloads)
Change in global variables or static field since Flutter regards them as state
Changes to anything that are not in the build path (eg. initState()) and also the app's main itself
You've got compilation errors, check debug console to be sure
App is killed either by user or by OS because of inactivity
When Enumerated types are changed to to regular classes or vise versa
Font is changed
When Generic type decorations are modified
When included native code (Java, Kotlin or Swift) is modified
CupertinoTabView builder widget

reference: Hot Reload

score 1 · Answer 11 · answered May 26 '20 at 04:46

1

If you're implementing your MaterialApp in main.dart will cause this issue, the best practice is to separate out another dart file, then refer from main.dart.

answered May 26 '20 at 04:46

Jex

11
1

how can i do that? – Neil Rodriguez Jun 22 '20 at 17:41

score 1 · Answer 12 · answered Apr 18 '21 at 06:37

Work for me:

Go to the flutter directory on your pc.
Write to the console: git checkout tags/2.0.5 (2.0.5 is latest version in stable tree for now, you can choose any others.)
Write to the console in your project: flutter --version And hot reload should work. I don't know why, but after command: flutter upgrade, my hot reload don't work

score 1 · Answer 13 · answered Jun 30 '23 at 07:59

1

Try the following things

Make sure auto-save is checked under file
Go to settings and make sure that flutter auto load isn't manual. Change it to all if it

answered Jun 30 '23 at 07:59

Ermiyas Tsegabu

11
2

Iandra Bedin · Answer 14 · 2019-11-02T15:35:17.583

I had the same problem. Currently I am using VSCode version 1.39.2.

For the hot reload to work you need to start debugging in VSCode.

As it says in the docs: "Only Flutter apps in debug mode can be hot reloaded." https://flutter.dev/docs/development/tools/hot-reload

You can find that option on the VSCode's top navigation inside Debug or with the shortcut F5.

You don't need to do flutter run on your terminal, nor even on VSCode, is just start debugging and it will launch lib/main.dart in debug mode.

If that doesn't solve the problem, try downgrading to the last version of VSCode.

score 0 · Answer 15 · answered Apr 17 '20 at 07:52

with VS Code(v1.44.1), Android Studio(v3.6.2), Flutter v1.12.13+hotfix.9 on Linux

Android studio > at Startup window > configure > AVD manager > run one virtual device > confirm VS Code(v1.44.1) has your running virtual device shown in lower right corner

VS Code > Run(at top, next to Help) > Start debugging(F5) or Start without debugging(Ctrl + F5)

Save your Flutter code in VS Code Then the emulator should be triggered for hot reload

Newaj · Answer 16 · 2020-04-30T04:47:14.993

I had the same problem in VS code. Here is how I solved it :

I was using style property for Text from an external file. I found that change in external file doesn't reflect in hot reload.
```
          Text(
            AppStrings.giveFeedbackPageText,
            style: AppStyles.bodyText,
            textAlign: TextAlign.center,
            overflow: TextOverflow.ellipsis,
          ),
```
So I had to use TextStyle from that file instead of an external file, and it works! Dont know the reason. Probably the external style needs to be inside a widget.
Another solution could be - separating home from MaterialApp into a separate widget.

score 0 · Answer 17 · answered Jan 05 '21 at 08:49

For those who are using MAC.

I am using mac, and I handled this through by quitting first the emulator and VS Code and then restarting the computer.

It should be kept in mind that when you use stateless or stateful widget then you can get the feature of hot reload.

By pressing command+s it will save the file and will perform hot reload automatically.

score 0 · Answer 18 · answered Oct 07 '21 at 10:45

0

May be you have changed the Keyboard shortcuts for hot reloading , kindly check if it is...

answered Oct 07 '21 at 10:45

abdul_basit

1
2

This does not provide an answer to the question. Once you have sufficient [reputation](https://stackoverflow.com/help/whats-reputation) you will be able to [comment on any post](https://stackoverflow.com/help/privileges/comment); instead, [provide answers that don't require clarification from the asker](https://meta.stackexchange.com/questions/214173/why-do-i-need-50-reputation-to-comment-what-can-i-do-instead). - [From Review](/review/late-answers/30017915) – Dom Oct 08 '21 at 01:24

score 0 · Answer 19 · answered Jan 15 '22 at 16:55

0

Solution is :

Click on File > Preferences > Settings
Search for "Hot Reload"
Click on Flutter Hot Reload On Save and choose always
after that Click on File and Click on Autosave.

answered Jan 15 '22 at 16:55

Zakaria Ferzazi

364
3
4

score 0 · Answer 20 · answered May 11 '22 at 09:23

0

try killing dart from terminal by typing killall -9 dart

then: 1- close vscode

2- re-open vscode (it may crash in the first run so reopen it again)

3- run flutter clean

4- run flutter pub get

5- run flutter run

this will fix the issue

answered May 11 '22 at 09:23

Mohammed Adel

71
3

score -1 · Answer 21 · answered Feb 16 '19 at 13:13

-1

For flutter hot reload problems that may be happening with your project,

It is a problem with your device, and not flutter or Android Studio

This happens when your logcat hangs up.

You might want to increase your buffer size.

To do this, go into your device or emulator:

Settings > Developer options (Ensure they are turned on),

Change the buffer size to a higher number.

Then run flutter run -v again

answered Feb 16 '19 at 13:13

Nderitu Kelvin

169
1
2

same issue happening for me also and no success with above steps. – Sagar Panwala Mar 12 '19 at 16:16
1

This is copy pasted from a GH issue!? I just read that somewhere else and it doesn't work. – aderchox Dec 01 '19 at 19:05

score -1 · Answer 22 · answered Nov 21 '20 at 14:07

Make sure you don't have this type of imports I was going crazy and deleting them fixed the hot reload, check all your files, I found this answer in github: https://github.com/flutter/flutter/issues/49744

import file:///C:/Users/.../.../< App Name >/lib/filename.dart

score -3 · Answer 23 · answered Jul 03 '21 at 08:00

-3

try Ctrl + S , when I press Ctrl + S it's automatically doing hot reload

answered Jul 03 '21 at 08:00

Mohammed Imam

43
7

VSCode hot reload for Flutter does not work

23 Answers23

Linked