VSCode hot reload for flutter

There's an extension for that. Called `Dart Code` and another one named `Flutter Code`

They will detect that your project is a Dart/Flutter project. And allows you to debug it + hot reload using f5.

VSCode debug -> `start debuging`, make a change and try, That's what you want.

on Mac select

> Run without Debugging or Shift+f5

you will see this at top select the electric icon for Hot Reload.

[![Hot Reload Bar][1]][1]


[1]:

After doing some changes save it. It will auto reflect changes.

You need to run Flutter app from VS Code's built-in debugger not VS Code's terminal.

[![Run Hot Reload picture][1]][1]

Select ▷ then "Run without Debugging" -> You can now use ⌘S on Mac to ⚡ Hot Reload ⚡

[1]:

**===== Aug 2022 UPDATE =====**

v3.42 and above: You can enable hot reload on autosave in the latest version by setting *Flutter Hot Reload On Save* to `allIfDirty` in your VSCode settings.

**===== Old Versions (Early 2022 and below) =====**

**v3.41 and below:** You can enable hot reload on autosave in the latest version by setting `Flutter Hot Reload On Save` to `always` in your VSCode settings.

**v3.19 only:** They disabled hot reload on autosave completely.

**v3.18 and below:** The extension hot reloads automatically when auto saving.

[![Setting ][1]][1]

if flutter and dart extensions already installed on vscode

Set from manual to All

[1]:

If you run your flutter project from the terminal you will have to manually press `r` to do a hot reload.

Therefore use the `Run and Debug` option in the VS Code to test your project.

For **2023**, this solution worked.

**Steps**

1. Open Settings.
2. Paste this text > **`dart.flutterHotReloadOnSave`** on the settings search box.
3. And change value from "**Manual**" to "**All**"

[![screenshot][1]][1]


[1]:

If you want enabled hot reload in flutter project you need to enable auto save in file>autosave in vscod IDE