What would cause npm live-server to stop detecting file changes?

Question

This was working on my system and now is not. I have live-server version 0.8.1 installed globally.

npm install live-server -g

But when I start it I don't get the "Live reload enabled." message in the browser console.

I've uninstalled it completely and re-installed it to no avail.

The http server is working. It will serve up my index.html and all related content. It just won't detect file changes.

Starting live-server:

live-server --open=src

I'm using typescript outputting js to src/dist/... I've verified that the file is changing. I can modify the js directly as well. In no case does live-server detect any changes.

File system permissions? Cached configuration?

What's causing this?

Answer 1

I had been having this issue as well, and stumbled across one exchange between Ritwick Dey (author of live-server), and a dev having the same issues.

As it turns out, it's as simple as not using a self-closing tag.

In my case, I was using React, and the line in question (in my HTML file) was

<script src="/scripts/app.js" />

Changing it to the following immediately fixed my issue, and got the "Live reload enabled" message in my Console, and hot reloading to work again.

<script src="/scripts/app.js"></script>

Hope this helps.

(here's a link to the conversation: https://github.com/ritwickdey/vscode-live-server/issues/82 )

Answer 2

This may have been a Chrome caching issue. I opened Safari and voila, everything started working. Closed Safari and now Chrome is working again.

I'm going to call this a bizarre environmental fluke.