When editing with VS Code, I think one of the “I wonder if it can be done” is “Reflect the browser status in real time when editing HTML”. “Live Server” is a convenient extension function in such a case.
This is an extension that updates the display without refreshing (reloading) the browser side when you edit the file and press “Save”.
First, search for “Live Server” from the icon in the menu. Live Ser … I think it will come out first of the candidates.
Click Go Live to run Live Server.
Port: 5500 with localhost loopback address (127.0.0.1) is started, and the display on the browser side is updated in real time just by saving the VSCode file!
To stop Live mode, click Port: 5500 next to the no-entry icon.
I also want the editorial side to be in real time
It is convenient as it is, but if it is left as it is, it will take a lot of time and effort to “overwrite and save on the editing side”. Like the live preview of “Brackets”, I want the HTML file and browser screen to change in real time even while editing …!
In that case, turn on the automatic save setting.
off: Do not save automatically
afterDelay: Save if there is no operation at the time of AutoSaveDelay below
onFocusChange: Save when editor loses focus
onWindowChage: Save when window loses focus
If you set afterDelay and AutoSaveDelay to 1, you can realize the environment of editing → browser reflection in almost real time.
Please refer(^ ^)