Table of Contents
Modify the configuration of VSCode
Home Development Tools VSCode How to configure VSCode to realize automatic response of Flutter and Hot Reload!

How to configure VSCode to realize automatic response of Flutter and Hot Reload!

Oct 25, 2021 am 11:13 AM
flutter vscode

VSCodeHow to write Flutter and Hot Reload automatically respond? The following article will introduce to you how to configure VSCode. I hope it will be helpful to you!

How to configure VSCode to realize automatic response of Flutter and Hot Reload!

I have been using VSCode to write Flutter.

I didn’t set up VSCode much before, but when I was writing Flutter, there was a function that I was very comfortable using, that is, Once I rewrote the code, VSCode would automatically Hot Reload is performed.

But after I upgraded VSCode, this function disappeared inexplicably. You must manually execute cmd s before executing Hot Reload. [Recommended study: "vscode tutorial"]

It was obviously automatic before, but now it is manual, but I am not used to it, so I decided to check how to change this configuration.

Modify the configuration of VSCode

After a fierce search on the Internet, I finally found the configuration method, and now I share it:

1. Open the VSCode settings:

How to configure VSCode to realize automatic response of Flutter and Hot Reload!

2. Search dart.flutterHotReloadOnSave in the input box. We can see the default configuration manual at this time, only reload for manual saves, If and only when saving manually, start reload

How to configure VSCode to realize automatic response of Flutter and Hot Reload!

##3. Replace

manual with always:

How to configure VSCode to realize automatic response of Flutter and Hot Reload!

Let’s take a gif to see the effect. I used the source code of Flukit. After modifying the title of the AppBar and undoing the modification,

it was completed without saving or other keyboard operations. Hot Reload function:

屏幕录制2021-10-21 10.31.28.2021-10-21 10_37_07.gif

At this point, the

Hot Reload automatic response function I am used to is back.

Reference Document

https://stackoverflow.com/questions/49210769/vscode-hot-reload-for-flutter

Summary

As the saying goes, "A is like honey, B is like arsenic".

I am used to this automatic response to Hot Reload, but some people are more accustomed to saving and then Hot Reloading, because it may just change the logic to trigger Hot Reloading, and not everyone likes it, and more or less Consume performance.

Although Android kids have suggested that I use Android Studio for Flutter development, I'm still not used to it. I prefer VSCode, which is powerful enough and light enough at the same time.

I have always been used to writing Flutter through VSCode, but I use Android Studio when building apk or converting JSON to Model.

See you next time.

For more programming related knowledge, please visit:

Programming Video! !

The above is the detailed content of How to configure VSCode to realize automatic response of Flutter and Hot Reload!. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Roblox: Bubble Gum Simulator Infinity - How To Get And Use Royal Keys
4 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
Nordhold: Fusion System, Explained
4 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
Mandragora: Whispers Of The Witch Tree - How To Unlock The Grappling Hook
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Hot Topics

Java Tutorial
1672
14
PHP Tutorial
1277
29
C# Tutorial
1257
24
How to define header files for vscode How to define header files for vscode Apr 15, 2025 pm 09:09 PM

How to define header files using Visual Studio Code? Create a header file and declare symbols in the header file using the .h or .hpp suffix name (such as classes, functions, variables) Compile the program using the #include directive to include the header file in the source file. The header file will be included and the declared symbols are available.

What computer configuration is required for vscode What computer configuration is required for vscode Apr 15, 2025 pm 09:48 PM

VS Code system requirements: Operating system: Windows 10 and above, macOS 10.12 and above, Linux distribution processor: minimum 1.6 GHz, recommended 2.0 GHz and above memory: minimum 512 MB, recommended 4 GB and above storage space: minimum 250 MB, recommended 1 GB and above other requirements: stable network connection, Xorg/Wayland (Linux)

How to solve the problem of vscode Chinese annotations becoming question marks How to solve the problem of vscode Chinese annotations becoming question marks Apr 15, 2025 pm 11:36 PM

How to solve the problem that Chinese comments in Visual Studio Code become question marks: Check the file encoding and make sure it is "UTF-8 without BOM". Change the font to a font that supports Chinese characters, such as "Song Style" or "Microsoft Yahei". Reinstall the font. Enable Unicode support. Upgrade VSCode, restart the computer, and recreate the source file.

vscode terminal usage tutorial vscode terminal usage tutorial Apr 15, 2025 pm 10:09 PM

vscode built-in terminal is a development tool that allows running commands and scripts within the editor to simplify the development process. How to use vscode terminal: Open the terminal with the shortcut key (Ctrl/Cmd). Enter a command or run the script. Use hotkeys (such as Ctrl L to clear the terminal). Change the working directory (such as the cd command). Advanced features include debug mode, automatic code snippet completion, and interactive command history.

Where to write code in vscode Where to write code in vscode Apr 15, 2025 pm 09:54 PM

Writing code in Visual Studio Code (VSCode) is simple and easy to use. Just install VSCode, create a project, select a language, create a file, write code, save and run it. The advantages of VSCode include cross-platform, free and open source, powerful features, rich extensions, and lightweight and fast.

vscode Previous Next Shortcut Key vscode Previous Next Shortcut Key Apr 15, 2025 pm 10:51 PM

VS Code One-step/Next step shortcut key usage: One-step (backward): Windows/Linux: Ctrl ←; macOS: Cmd ←Next step (forward): Windows/Linux: Ctrl →; macOS: Cmd →

Common commands for vscode terminal Common commands for vscode terminal Apr 15, 2025 pm 10:06 PM

Common commands for VS Code terminals include: Clear the terminal screen (clear), list the current directory file (ls), change the current working directory (cd), print the current working directory path (pwd), create a new directory (mkdir), delete empty directory (rmdir), create a new file (touch) delete a file or directory (rm), copy a file or directory (cp), move or rename a file or directory (mv) display file content (cat) view file content and scroll (less) view file content only scroll down (more) display the first few lines of the file (head)

vscode terminal command cannot be used vscode terminal command cannot be used Apr 15, 2025 pm 10:03 PM

Causes and solutions for the VS Code terminal commands not available: The necessary tools are not installed (Windows: WSL; macOS: Xcode command line tools) Path configuration is wrong (add executable files to PATH environment variables) Permission issues (run VS Code as administrator) Firewall or proxy restrictions (check settings, unrestrictions) Terminal settings are incorrect (enable use of external terminals) VS Code installation is corrupt (reinstall or update) Terminal configuration is incompatible (try different terminal types or commands) Specific environment variables are missing (set necessary environment variables)

See all articles