Question 220398 in Visual Studio Code Question posted in
View the official documentation.

Visual Studio Code – Is it possible to auto restart Edge DevTools in VS Code?

enter image description here

I am using VS Code for learning web design. I have a problem with EDGE DevTools for VS Code. While running html with Edge DevTools in VS Code, I have to click restart to see the change in DevTools as well as in the browser. So I want to know if there is any option to automatically refresh the devtools. Thanks.

i am expecting something like live browser extension does.

Tags:

2

Answers


  1. 0

    There is an option to automatically refresh the devtools in VS Code. You can use the LiveReload extension. This extension will automatically reload your browser when you make changes to your code.

    To install the LiveReload extension, open VS Code and go to the Extensions tab. Search for LiveReload and install the extension.

    Once the extension is installed, you need to enable it. To do this, open the Command Palette (Ctrl+Shift+P) and search for LiveReload: Enable/disable server. Click on this command to enable the server.

    Now, when you make changes to your code, the browser will automatically reload. You can also manually reload the browser by pressing Ctrl+R.

    Here are the steps on how to automatically refresh the devtools in VS Code using the LiveReload extension:

    (a) Install the LiveReload extension.
    (b) Enable the server.
    (c) Make changes to your code.
    (d) The browser will automatically reload.

    You can also configure the LiveReload extension to reload the browser on specific events, such as saving a file or opening a new file.

    Hope this helps you.

    Login or Signup to reply.
  2. 0

    Yes, you can achieve it by installing Live Server extension in VS Code. And then, you’ll need to perform these steps:

    1. Right-click the file you want to open and choose "Open with live server".
    2. Copy the location from the URL bar of the browser tab that Live server opened.
    3. Go back to VS Code and right-click the same file, this time choosing "Open with Edge" and either "Open Browser" or "Open browser with DevTools".
    4. In the browser panel that opens, paste the URL from earlier.
    5. You can now "auto-reload" the HTML file by simply "saving" the file, and the changes are visible in DevTools as well.

    Live Server + Microsoft Edge DevTools extension for Visual Studio Code is a combination acknowledged by Microsoft official document. You can refer to this doc for more information, including a video tutorial if there’s anything unclear.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search