6

I've setup the Debugging with Chrome and it works reasonably well. However, every time I make a change & save the .htm file, I have to click the Restart icon in the toolbar for the changes to propagate to the instance of Chrome.

Is there a way for VS Code to "restart" when I save the file?

P.S. I am editing a local file (no web servers involved).

AngryHacker
  • 59,598
  • 102
  • 325
  • 594
  • I personally start a local webserver first (via gulp and browserSync) and then start the debugger. Changes in the files are then injected or reloaded in the chrome debugger with no need to restart. – Mark Nov 30 '17 at 05:28

1 Answers1

15

I wanted to do exactly the same thing and accomplished it by installing an extension that allows me to execute a VS Code extension command when a file is saved.

The extension is Save and Run Ext and is a fork off of another extension but allows you to execute VS Code extension commands.

I added the following configuration to my settings.json file:

{
  "saveAndRunExt": {
    "commands": [
      {
        "match": "\\.(css$|js$|html$)",
        "isShellCommand": false,
        "cmd": "workbench.action.debug.restart"
      }
    ]
  }
}

What this does is whenever a .css, .js, or .html file is saved, it will restart the debugger. You could of course configure it to do whatever you want.

An alternative (one step) solution is instead of saving the file, just restart the debugger, and it automatically saves all files and changes are propagated to Chrome.

KyleMit
  • 30,350
  • 66
  • 462
  • 664
Don Nguyen
  • 176
  • 2
  • 5
  • Works great for auto restarting a server written in dart. Can even be configured to auto run tests!. For details if using dart see: https://github.com/Microsoft/vscode/issues/49209#issuecomment-675101308. Should be possible to configure this extension to run tests for other languages too. – mmccabe Aug 17 '20 at 20:59