live server not reloading automatically
Opened this issue · 191 comments
I'm submitting a...
[x] Regression (a behavior that used to work and stopped working in a new release)
[x] Bug report <!-- Please search GitHub for a similar issue or PR before submitting -->
[ ] Feature request
[x] Documentation issue or request
## Current behavior
live server not reloading automatically
## Expected behavior
it reload without manually reloading the browser
## Environment
```html
Browser:
- [x] Chrome (desktop) version
- [x] Firefox version
For Tooling issues:
- Live Server: 5.6.1
- Platform: Windows
- Visual Studio Code: 1.33.1Can anybody please answer me???
Same goes for me. I noticed it recently. Live server would serve the file in the browser, but it would not refresh the browser automatically upon saving the file.
What I've tried:
- Unistalled live server
- Unistalled VSCode
- Deleted ritwickdey.liveserver-5.6.1 from C:\Users\USERNAME\extensions\ritwickdey.liveserver-5.6.1
SOLVED
In my case:
I had my HTML file inside a folder, which name starts with a period .
Don't do this 👇
I'm experiencing the same problem here.
I think the recent VSCode update made it unworking as expected.
Before updating, it worked well.
I'm experiencing the same problem here.
I think the recent VSCode update made it unworking as expected.
Before updating, it worked well.
Yes, the recent update has broken it
Hi, I have the same problems.
Auto-refreshing isn´t working.
My enviroment:
Windows 10.
VSCode 1.35.1 (I have also tried in 1.34 and it didn't work either)
Live server: 5.6.1
Browser: Chrome aor Firefox (I have tried in both of them)
I have tried re-installing, and deleting the files from extension file for a completed resetting.
Any solution?
I too have the same problem . Live reload not working
Chrome Version: 75.0.3770.100 (Official Build) (64-bit)
Vscode version 1.36
Live server version 5.6.1
I had the same issue and my problem was that my html file wasn't encoded in utf8
I had the same issue. Until now, i couldn't figure out what's the problem. My environment:
Windows 10
Chrome Version: 76.0.3809.100 (Official Build) (64-bit)
VSCode 1.36.1
Live Server 5.6.1
So far, it's been a random occurrence for me when i encounter this "page doesn't reload automatically". I sometimes have it working after i click save, but only after a couple of minutes until the "auto-reload" doesn't work anymore. When i restarted my computer, it's a 50/50 chance that LiveServer will work correctly. Right now, i dont have a reliable solution as what may causing this problem. I think it could be my Windows 10, but i don't know how to check it.
Make sure to save your workspace configuration then it will work.
Having the same problem after updating to 1.37.1, tried deleting ritwickdey.liveserver-5.6.1 from C:\Users\USERNAME\extensions\ritwickdey.liveserver-5.6.1, and re-installing VS CODE, but not working yet as well.
It only refreshes after I save the doc for me.
It only refreshes after I save the doc for me.
Had the same issue. Was solved by changing autosave option in setting to afterDelay.
Make sure meta charset = "UTF-8" is in the head.
Make sure meta charset = "UTF-8" is in the head.
Worked For Me, Thanks Man
Works on my work computer, not my personal computer. , refreshed, reloaded, uninstalled & re-installed several different ways. Still not auto-refreshing. Console says "live reload enabled"... I've narrowed my open folders to just one,...
I had the same issue and my problem was that my html file wasn't encoded in utf8
thanks bro, it worked
I was having the same issue.
It seems to work fine if I open a specific file with Live Server by either the Ctrl-Shift-P Command Pallet, Right-click menu, or Alt-L Alt-O key command. It doesn't work properly if I start Live Server by clicking "Go Live" in the status bar at the bottom.
Hope this helps someone!
I was having the same issue.
It seems to work fine if I open a specific file with Live Server by either the
Ctrl-Shift-PCommand Pallet, Right-click menu, orAlt-L Alt-Okey command. It doesn't work properly if I start Live Server by clicking "Go Live" in the status bar at the bottom.Hope this helps someone!
This really works.
Anyone able to get Live Server to update in Chrome?
I really like this extension and have used it for a long time. Tonight it does not reload and I need to a hard refresh to get current page.
Reinstalled and checked for updates to no avail.
Would love to get it back working as I really like it!
Thanks for all the work you have put in.
Craig
Was having the same issue. Looks like it was as simple as how I was opening the file. When I go to File > Open Folder, it seems to work every time. When I open the individual files, it doesn't work. This thread was the key, Thank you!
I just found this, and then randomly at the same time I noticed a notification in vscode telling me that live reload isn't possible without head and body (I was editing a file that's just an html fragment)
I've been having the issues on two different computers, both using Windows 10.
Both times, my CSS file was not updating. My html file was updated, but oddly enough, not CSS.
This was fixed by hard refreshing to show changes.
There's one thing that resolves the issue.
• Open settings.
• Search for 'autosave'.
• Set it to 'afterDelay'.
• Just below that, set the AutoSaveDelay to anything very less like 5 (I have set it to 1)
• Now search for 'Wait' in settings.
• In LiveServer > Settings:Wait, set the value very low (e.g. 3).
This should help regardless of platforms :)
SOLVED
I have the same problem, like @pordemoni , the name of my folder starts with '#', change the start character for a letter and the problem was solved.
@yednaphsotnas Thanks, dude.
I NGINX server and able to load my website using proxy, but it does reload if i make change & save in a html.twig file. Please help!
Live Server não atualiza após salvar arquivo html via vscode
Versões:
- Live Server v5.6.1
- VSCode v1.42.1
Tentativas de reparo:
-
Desativado "onSave" para "off"
-
Reinstalado Live Server
-
Restart no VSCode
-
salvamento automático: afterDelay
-
AutoSaveDelay: 1
-
LiveServer Wait: 1
-
Removido a pasta: .vscode/ritwickdey.liveserver-5.6.1
Alguém tem uma solução por favor?
There's one thing that resolves the issue.
• Open settings.
• Search for 'autosave'.
• Set it to 'afterDelay'.
• Just below that, set the AutoSaveDelay to anything very less like 5 (I have set it to 1)
• Now search for 'Wait' in settings.
• In LiveServer > Settings:Wait, set the value very low (e.g. 3).
This should help regardless of platforms :)
This worked for me..
thanks 💃
Was having the same issue. Looks like it was as simple as how I was opening the file. When I go to File > Open Folder, it seems to work every time. When I open the individual files, it doesn't work. This thread was the key, Thank you!
Thanks this works
Meu Live Server voltou a funcionar após instalar outro plugin chamado Live Server Preview
Instalei, reiniciei o VSCode e testei o Live Server que funcionou corretamente.
Espero que outras pessoas possam ser ajudadas com esta solução estranha assim como eu fui.
Meu Live Server voltou a funcionar após instalar outro plugin chamado Live Server Preview
Instalei, reiniciei o VSCode e testei o Live Server que funcionou corretamente.
Espero que outras pessoas possam ser ajudadas com esta solução estranha assim como eu fui.
O meu não funcionou de jeito nenhum. não atualiza sozinho como deveria ser.
For those of you that are still having this problem, there could be some conflicts with some browser extensions you may have installed on your browser. To rule this out you can open your project on a private/incognito browser tab, which by default should disable extensions.
Another issue that may arise is when you're using a content security policy (CSP) which is set to block inline scripts.
Hope this helps.
SOLVED
In my case:
I had my HTML file inside a folder, which name starts with a period.Don't do this 👇
Same here but mine was #folderName
Looks like that live server fails to refresh if you have some issue with your html. In my case I had a silly mistake, I had a self-closing script tag <script src="index.js" />. Which Chrome recognized and properly loaded the javascript file but Live Server didn't
guilty as charged! this worked for me.
make sure you have written html code with html tag not just body elements. Sometimes it doesn't work without proper html format.
with windows 7 and recent chrome v81 works fine but in windows 10 it is not launching the browser.
Tried to run with compatibility mode still not launching.
Only shows port info but browser not opening at all
This is so frustrating especially for a beginner trying to get a grasp on things. The extension suddenly stopped working. I've deleted, reinstalled, followed the settings doc to configure the extension in settings.json but nothing. Clearly there's something interfering with the software running in the browsers, because right in the console it shows the Live Server icon and even runs but doesn't open the browsers. 🤦🏽♂️
Pretty sure its safe to say this repo is no longer maintained by the creator.
In my case, I did have it under a path called _Notes and moving it out made not difference.
I did'ht have the html/head/utf-8 set as I was only play with code and below fix it.
(added space after < so I could post the code)
< !doctype html>
< html>
< head>
< meta charset="utf-8">
..
..
< /head>
< /html>
There's one thing that resolves the issue.
• Open settings.
• Search for 'autosave'.
• Set it to 'afterDelay'.
• Just below that, set the AutoSaveDelay to anything very less like 5 (I have set it to 1)
• Now search for 'Wait' in settings.
• In LiveServer > Settings:Wait, set the value very low (e.g. 3).
This should help regardless of platforms :)
This solved my problem! Thank you so much.. I've been trying to find a solution for a while now.. After i changed the following settings it works like magic for me auto reloading..
Thanks!
When i start the live server with windows i am able to see the changes. When i switch to remote-WSL the site doesn't update anymore when i save. Going back to "reopen folder in Windows" and the site is updating again.
Any solution for this?
I never could get autorefresh to work, tried opening through 'Go Live button, RMB, changing VSC settings to autosave auto delay, changing liveserver delay to 5, (html already in utf-8) nothing has worked, I always had to refresh it manually in the browser.
Problem was Firefox, when I tried in chrome, everything works as it supposed to be, not sure where the problem is though...
SOLVED (For me at least)
In settings search for "useWebExt" en check you DON'T have it enabled. I just unchecked this and now it's working!
@noobato1 thank you bro, thanks for help, I LOVE YOU <3!
I was able to fix this by changing to a different distros. I was running WSL2-Ubuntu 20.04 with another workspace. I had switched workspaces to start another project but I was stilling running on the WSL distro. Steps I took to change it:
- Open remote window
- Close remote connection
- Close VS Code
- Reopen and navigate to the folder you need but run on a different distro. (You can tell what distro you're going to run on by looking at the file path and there may be an indicator like [WSL] next to the file name).
SOLVED (for me at least)
I installed the Live Server Chrome extension in my browser, enabled the Live Reload setting and reloaded the page once. From that moment on, the automatic reload started working! Hope it helps!
SOLVED (for me at least)
I installed the Live Server Chrome extension in my browser, enabled the Live Reload setting and reloaded the page once. From that moment on, the automatic reload started working! Hope it helps!
Didn't help :(
wow, so no one actually has a any solid solution for this yet ??
What does the Live Server Chrome extension do?
One thing I remember is that if you rename the extension folder under Programdata - no good, you have to delete it or move it out.
I would not be able to live without this extension, this and his SASS Live compiler [Ritwick Dey - I owe you a beer]
Hi guys. it's simple. if you go to setting you will see auto save is off. choose "after delay" and done.
Ok guys, I figured out what my issue was and maybe it can help someone else.
I tried everything in this thread, I switches browsers and still Auto Reload wouldn't work. Then it dawned on me. I use WSL2.
Immediately I thought that might be the culprit. Deleted my repo from my WSL directory and cloned it again directly into my Windows 10 Documents folder. And it immediately worked.
Tested on both FF and Chrome.
Hope that helps.
I fix this just activating Use local ip and Full Reload in configuration
Does not work on VSCode 1.49.2 Live Server 5.6.1
[Extension Host] Change detected d:\Cloud\index.html
console.ts:137 [Extension Host] Looking for parseable documents...
console.ts:137 [Extension Host] Found all parseable documents.
console.ts:137 [Extension Host] Parsing documents and looking for CSS class definitions...
console.ts:137 [Extension Host] Summary:
console.ts:137 [Extension Host]% 1 parseable documents found
console.ts:137 [Extension Host]% 0 CSS class definitions found
console.ts:137 [Extension Host]% 0 unique CSS class definitions found
console.ts:137 [Extension Host]% 0 failed attempts to parse. List of the documents:
console.ts:137 [Extension Host]
Does not work on VSCode 1.49.2 Live Server 5.6.1
[Extension Host] Change detected d:\Cloud\index.html console.ts:137 [Extension Host] Looking for parseable documents... console.ts:137 [Extension Host] Found all parseable documents. console.ts:137 [Extension Host] Parsing documents and looking for CSS class definitions... console.ts:137 [Extension Host] Summary: console.ts:137 [Extension Host]% 1 parseable documents found console.ts:137 [Extension Host]% 0 CSS class definitions found console.ts:137 [Extension Host]% 0 unique CSS class definitions found console.ts:137 [Extension Host]% 0 failed attempts to parse. List of the documents: console.ts:137 [Extension Host]
The reason was a missing in the html file. If no section is available in the source for the live-server cannot be injected. According to https://www.w3.org/MarkUp/html3/dochead.html the head section can be omitted. So this appears to be a bug in Live Server 5.6.1.
SOLVED (For me at least)
In settings search for "useWebExt" en check you DON'T have it enabled. I just unchecked this and now it's working!
This worked for me 9/29/2010 - thanks!
It only refreshes after I save the doc for me.
Had the same issue. Was solved by changing autosave option in setting to afterDelay.
This worked for me. thank you!!!
The problem still persist tho
The problem still persist tho
Found a fix, I've recently enabled Format on Save and turning it of resolves my issue
I had the same issue on Linux ubuntu and I resolved it by changing the number of files vsCode tracker can track:
open file: /etc/sysctl.conf
add following line at the end:
fs.inotify.max_user_watches=524288
close all folder,
reopen vsCode,
open folder,
Click on file,
right-click on that file-> open with live server.
SOLVED (For me at least)
In settings search for "useWebExt" en check you DON'T have it enabled. I just unchecked this and now it's working!
Clicked the checkbox and that did the TRICK!!!
SOLVED
In my case:
I had my HTML file inside a folder, which name starts with a period.Don't do this 👇
I've been on this issue for five days straight, I never thought it was something as trivial as this
can anyone help me please?
i tried all the solution but no one is working for me :(
the problem is that the live server extension is not working on saving the file, it only works when i go and refresh the browser page
can anyone help me with this please
thanks in advance
Is your html code correctly formatted, if I just do code samples without the correct head tag - it wont work.
..and maybe you also need the .
Hi friends, it worked fine for me in the beginning, until I installed a few more extensions (like Browser Preview) and also played around with the settings. Later I made more confusions on the settings on delayAfterSave, wait etc., as the live server stopped working. A restart of the vscode has not helped me at all.
After googling a bit and also on this thread, I started redoing the things. I opened the "settings.json" file in the VSCode and removed all the settings related to browser preview, and it worked again :) May be you can try resetting the entries and toggle the entries to find out what is dominating what. Please be informed that a few extensions might dominate the similar/relevant entries.
FYI, my settings.json as of now (seems working fine) copy is below.
`{
"workbench.colorTheme": "Solarized Dark"
"editor.minimap.enabled": false,
"editor.formatOnSave": true,
"editor.defaultFormatter": "esbenp.prettier-vscode",
"prettier.useTabs": true,
//"liveServer.settings.useWebExt": true,
//"liveServer.settings.fullReload": false,
"liveServer.settings.donotShowInfoMsg": false,
"liveServer.settings.CustomBrowser": "chrome" //,
//"liveServer.settings.wait": 1,
//"files.autoSave": "afterDelay",
//"files.autoSaveDelay": 1
}
`
The lines commented were played one after another to bring back the live server. I think the default value of 100 ms is still fine for the wait if any in looking for. Hope it helps someone else.
Cheers,
RM.
Hi guys. it's simple. if you go to setting you will see auto save is off. choose "after delay" and done.
@Pouria-R
May have been a combination of setting up the Live Server Chrome extension in my browser and enabling the Live Reload setting but neither worked until checking this option. Thanks!!!
Hi All!
It appears that the issue I'm having is slightly different and I'm not sure if I need to open a new issue or not.
What's Expected: The browser to auto-reload/refresh on file edit.
What's Happening: The browser will only auto-reload when the edited file is saved.
Ask: Is this normal behavior or is it correct to assume that I should see edits appear in "real time"? If the expected behavior is correct, what can I try to correct this issue?
Visual Studio Code
Version: 1.52.0 (user setup)
Commit: 940b5f4bb5fa47866a54529ed759d95d09ee80be
Date: 2020-12-10T22:45:11.850Z
Electron: 9.3.5
Chrome: 83.0.4103.122
Node.js: 12.14.1
V8: 8.3.110.13-electron.0
OS: Windows_NT x64 10.0.19042
Live Server
Id: ritwickdey.liveserver
Version: 5.6.1
"liveServer.settings.AdvanceCustomBrowserCmdLine": null
Thank you in advance to anyone who is able to answer this question.
-Matt
for me anyways and how I believed it to work is.
after I save, that's when the browser auto-refreshes.
(not when I type changes).
Somehow this configuration worked for me.
Live server able to open the webpage on the browser but it was not reloading automatically after i saved the file, so i tried all the above methods that stated by the user but unfortunatlly none of them work for me.
Then i follow this step: #20
and it worked.
just go to Setting , serach for Use Local Ip and tick the checkbox.
Can anyone help me please?
I noticed it recently. Live server would serve the file in the browser, but it would not refresh the browser automatically upon saving the file.
Live Server: v5.6.1
VS Code: Version: 1.52.1 (user setup).
I re-installed VS Code and Live Sever but the problem is not solved.
Can anyone help me please?
I noticed it recently. Live server would serve the file in the browser, but it would not refresh the browser automatically upon saving the file.
Live Server: v5.6.1
VS Code: Version: 1.52.1 (user setup).
I re-installed VS Code and Live Sever but the problem is not solved.
This worked for me.
Here
SOLVED (For me at least)
In settings search for "useWebExt" en check you DON'T have it enabled. I just unchecked this and now it's working!Clicked the checkbox and that did the TRICK!!!
Spent ages on this thread trying with different settings, unchecking this worked for me
Make sure meta charset = "UTF-8" is in the head.
Its there in my head tag but its still not auto-refreshing why is this so??
I'm submitting a...
[x] Regression (a behavior that used to work and stopped working in a new release) [x] Bug report <!-- Please search GitHub for a similar issue or PR before submitting --> [ ] Feature request [x] Documentation issue or request ## Current behavior live server not reloading automatically ## Expected behavior it reload without manually reloading the browser ## Environment ```html Browser: - [x] Chrome (desktop) version - [x] Firefox version For Tooling issues: - Live Server: 5.6.1 - Platform: Windows - Visual Studio Code: 1.33.1
Ok so I tried doing one thing and it worked !
So Just Check If Your Folder Name Starts With Any Thing Like This : . # @ ! or anything else just rename that and remove any marks from the folder name
Mine was #JsSite and thats why it was not auto reloding but now it works 🥇
SOLVED (For me at least)
In settings search for "useWebExt" en check you DON'T have it enabled. I just unchecked this and now it's working!
Finally.. This is work for me. Thanks a lot
If nothing else here works for you; if you have a browser extension that by default blocks JavaScript until you whitelist the page (in my case ScriptSafe), make sure that you've actually whitelisted 127.0.0.1 or whichever IP you use for Live Server.
SOLVED (For me at least)
In settings search for "useWebExt" en check you DON'T have it enabled. I just unchecked this and now it's working!Finally.. This is work for me. Thanks a lot
This worked for me.
Thanks!
For me it refreshes only if i save. (linux mint 20.1 ulysa) -
Version: 1.53.0-insider
Commit: 861a88ebadb4335df92251faf6420b598440e082
Date: 2021-01-29T21:49:47.914Z
Electron: 11.2.1
Chrome: 87.0.4280.141
Node.js: 12.18.3
V8: 8.7.220.31-electron.0
OS: Linux x64 5.4.0-65-generic)
Make sure meta charset = "UTF-8" is in the head.
Lol this was the whole solutin
If you are here couse live server is not reloading on Brave browser but it is on Chrome , try to disable Brave shields (the brave icon that disable scripts and that stuff...)
It work for me :p
I have seen this issue in a lot of machines, It generally happens when we have lot of things installed such as neon, anaconda etc.
Best you can do is create a new system user and use vs code over there so it won't inter-fare with other environment variables and work perfectly.
I found out an workaround.
Steps to reproduce:
1 . I installed LiveServer extension for chrome.
2. Closed browser.
3. Start LiveServer in VSCode.
4. Open browser, start server extension.
Works perfectly.
Note: Sometime i need to push "live reload" button to switch it off on chrome extension and restart chrome. But it works.
My computer probably has a lot of issues and I`m not in the mood to reinstall everything yet :).
Hope it helps.
For me, I deleted "code" folder which was in Roaming. Then when I reinstalled VSC the firewall asked me the permission for a Port I believe, I can't remember well, but it was right after I open the Live Server tab. Also before that, I restarted some firewall settings. It has to do with the firewall and the browser you're using in the case is none of the solutions you have given. I hope this could help you.
Seems like it's just not working for me because I didn't have the html boiler plate. Once I had the bare bones, all seemed to be up and running. Guessing this isn't the same issue most are dealing with here?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
!!!! This live updates!!!!
</body>
</html>
I've been caught with not having a html boiler plate.
The other day it stop working so I uninstalled and delete from the vscode extension folder C:\Users{me}.vscode\extensions, then reinstall it.
Guys This Worked for me :
Go to your browser then go to settings and check if JavaScript is Enabled
:)
If nothing else here works for you; if you have a browser extension that by default blocks JavaScript until you whitelist the page (in my case ScriptSafe), make sure that you've actually whitelisted 127.0.0.1 or whichever IP you use for Live Server.
This helped me. I tried all the other suggestions but nothings worked. But I have this JavaScript Blocker extension... After whitelisted the page, the reload is working now. Thx.
Don't breake your head....Put in VScode (in settings) the Auto Save option with a AfterDelay of 600 ms(for example) and you will have your automatic refresh on Live Server while you are editing...
There are Youtube videos on that "issue"... is more simple of what you think...
Don't breake your head....Put in VScode (in settings) the Auto Save option with a AfterDelay of 600 ms(for example) and you will have your automatic refresh on Live Server while you are editing...
There are Youtube videos on that "issue"... is more simple of what you think...
This was my issue and once i did this on my new mac with vs code installed it was fixed. I did nealry ruin my whole afternoon becuase i forgot to change this, thanks czanon.
Hi friends, it worked fine for me in the beginning, until I installed a few more extensions (like Browser Preview) and also played around with the settings. Later I made more confusions on the settings on delayAfterSave, wait etc., as the live server stopped working. A restart of the vscode has not helped me at all.
After googling a bit and also on this thread, I started redoing the things. I opened the "settings.json" file in the VSCode and removed all the settings related to browser preview, and it worked again :) May be you can try resetting the entries and toggle the entries to find out what is dominating what. Please be informed that a few extensions might dominate the similar/relevant entries.
FYI, my settings.json as of now (seems working fine) copy is below.
{ "workbench.colorTheme": "Solarized Dark" "editor.minimap.enabled": false, "editor.formatOnSave": true, "editor.defaultFormatter": "esbenp.prettier-vscode", "prettier.useTabs": true, //"liveServer.settings.useWebExt": true, //"liveServer.settings.fullReload": false, "liveServer.settings.donotShowInfoMsg": false, "liveServer.settings.CustomBrowser": "chrome" //, //"liveServer.settings.wait": 1, //"files.autoSave": "afterDelay", //"files.autoSaveDelay": 1 }
The lines commented were played one after another to bring back the live server. I think the default value of 100 ms is still fine for the wait if any in looking for. Hope it helps someone else.Cheers,
RM.
IT worked for me Thanks 😉😉
Make sure meta charset = "UTF-8" is in the head.
Thanks, it is working great. no issue with autosaves and any other configuration.
SOLVED
In my case:
I had my HTML file inside a folder, which name starts with a period.Don't do this 👇
Same thing but my folders name starts with a # ... Problem Solved
My problem went away as soon as I enable autosave in VS. It seems to be triggered to perform its loading upon a file save.
I have changed the workspace to a particular folder yet its not working. Its working well on linux with auto save but not working on windows...
Can anyone help me please
I'm submitting a...
[x] Regression (a behavior that used to work and stopped working in a new release) [x] Bug report <!-- Please search GitHub for a similar issue or PR before submitting --> [ ] Feature request [x] Documentation issue or request ## Current behavior live server not reloading automatically ## Expected behavior it reload without manually reloading the browser ## Environment ```html Browser: - [x] Chrome (desktop) version - [x] Firefox version For Tooling issues: - Live Server: 5.6.1 - Platform: Windows - Visual Studio Code: 1.33.1
What is the solution for this ?