search

ritwickdey / vscode-live-server

Launch a development local Server with live reload feature for static & dynamic pages.
https://ritwickdey.github.io/vscode-live-server
MIT License
5.65k stars 1.22k forks source link

live server not reloading automatically #452

Open hillar10n opened 5 years ago

hillar10n commented 5 years ago

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
victorchilari commented 4 years ago

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 :(

Pannu786 commented 3 years ago

wow, so no one actually has a any solid solution for this yet ??

Darkmift commented 3 years ago

Get npm live-server. Works great...if you have node 😃

On Sun, Sep 6, 2020, 20:16 Pannu786 notifications@github.com wrote:

wow, so no one actually has a any solid solution for this yet ??

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/ritwickdey/vscode-live-server/issues/452#issuecomment-687846001, or unsubscribe https://github.com/notifications/unsubscribe-auth/AC63QIK7V33A4BBQVYT43TDSEO7W5ANCNFSM4HISWZDA .

MarkTRoss commented 3 years ago

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]

Pouria-Rezaeii commented 3 years ago

Hi guys. it's simple. if you go to setting you will see auto save is off. choose "after delay" and done.

stefanrows commented 3 years ago

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.

Pannu786 commented 3 years ago

Well my issue was I gave my folder name start with "#".. Don't ask why I did that but apparently if you use any special characters for a folder name then it also doesn't work.

On Fri, 18 Sep 2020, 13:30 Stefan Rows, notifications@github.com wrote:

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.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/ritwickdey/vscode-live-server/issues/452#issuecomment-694719725, or unsubscribe https://github.com/notifications/unsubscribe-auth/AKO6XDW5UM3O2SBGGWL4TK3SGMHQ3ANCNFSM4HISWZDA .

ghost commented 3 years ago

I fix this just activating Use local ip and Full Reload in configuration

theking2 commented 3 years ago

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]
theking2 commented 3 years ago

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.

davidmatthew-dev commented 3 years ago

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!

enqs4h commented 3 years ago

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!!!

yulose9 commented 3 years ago

The problem still persist tho

yulose9 commented 3 years ago

The problem still persist tho

Found a fix, I've recently enabled Format on Save and turning it of resolves my issue

jaysuthar743 commented 3 years ago

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.

ratsuns commented 3 years ago

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!!!

albas99 commented 3 years ago

SOLVED

In my case: I had my HTML file inside a folder, which name starts with a period .

Don't do this 👇

http://127.0.0.1:5500/.folder/index.html

I've been on this issue for five days straight, I never thought it was something as trivial as this

ehsanajmal commented 3 years ago

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

MarkTRoss commented 3 years ago

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 <!DOCTYPE html>.

itsraghz commented 3 years ago

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.

EMcGitBsa commented 3 years ago

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!!!

mattrmay commented 3 years ago

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

MarkTRoss commented 3 years ago

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).

Esh07 commented 3 years ago

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.

aryanaruni commented 3 years ago

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.

Esh07 commented 3 years ago

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

Banoulka commented 3 years ago

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

ASTRO-N1 commented 3 years ago

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??

ASTRO-N1 commented 3 years ago

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 🥇

AmrulHarahap commented 3 years ago

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

kensparby commented 3 years ago

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.

cesaralmeidadev commented 3 years ago

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!

Arramis commented 3 years ago

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)

KevinT27 commented 3 years ago

Make sure meta charset = "UTF-8" is in the head.

Lol this was the whole solutin

ivancardozo11 commented 3 years ago

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

YatinHasija commented 3 years ago

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.

Arramis commented 3 years ago

I found out an workaround. Steps to reproduce: 1 . I installed LiveServer extension for chrome.

  1. Closed browser.
  2. Start LiveServer in VSCode.
  3. 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.

JoaquinGodoy97 commented 3 years ago

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.

DonThePhan commented 3 years ago

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>
MarkTRoss commented 3 years ago

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.

Nihal-prog commented 3 years ago

Guys This Worked for me :

Go to your browser then go to settings and check if JavaScript is Enabled

:)

mpagels commented 3 years ago

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.

czanon commented 3 years ago

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...

shoshonearnold commented 3 years ago

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.

HarshilSharaf commented 3 years ago

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 😉😉

SHUBHAM-DHANUKA commented 3 years ago

Make sure meta charset = "UTF-8" is in the head.

Thanks, it is working great. no issue with autosaves and any other configuration.

Matulaz commented 3 years ago

SOLVED

In my case: I had my HTML file inside a folder, which name starts with a period .

Don't do this 👇

http://127.0.0.1:5500/.folder/index.html

Same thing but my folders name starts with a # ... Problem Solved

ZacharyVe commented 3 years ago

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.

AthulBabu232000 commented 3 years ago

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...

im-rahulkgupta commented 3 years ago

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 ?