My js code does not refresh itself in browsers when I change my code

I started to study javascript so, I started my localhost as using "http-server" in the relevant folder with console.

But when I change my index.html or main.js code, browser does not change.

First I defined a function as alert('Hi'); so, my chrome is stuck at alerting "Hi" .

Then I tried to use opera, it gave me the result but when I changed my code again, it's stuck with that result and this is what happened.

I tried to use vscode's live-server extentions but there must be another way to use that first localhost:8080 with it.

How can I fix this situation? Thanks in advance.

Edit: Some of you asked me for code but lets say I tried alert('Hi'); and second I added alert('Welcome');'. The issue is not about code, my browsers do not refresh the new results at my localhost.

1 answer

  • answered 2020-09-24 16:21 Carlos Daniel

    This is more of a browser issue than a Visual Studio Code issue. It happens because when alert function is called the browser freezes your app. Until that alert has been resolved by the user (Accept, cancel).

    If you have the alert in a loop and change your code, the browser won't know, because at first the only thing he knew was that the alert was infinite, so it stays as so.

    The only "fix" is to open a new tab at localhost everytime you change something that has to do with alerts. Or stop using alerts and start using console.log() which is the "standard" for testing code functionality.

    Edit: Also check if you setup correctly your server live reloading. Visual studio code Live Server extension has this setup by default.

    Live reloading reloads or refreshes the entire app when a file changes. For example, if you were four links deep into your navigation and saved a change, live reloading would restart the app and load the app back to the initial route.

    Hot reloading only refreshes the files that were changed without losing the state of the app. For example, if you were four links deep into your navigation and saved a change to some styling, the state would not change, but the new styles would appear on the page without having to navigate back to the page you are on because you would still be on the same page.