'Lite Server hot reload doesn't work for default config

Lite Server doesn't reload the page upon making changes to my index.html file.

I'm not using a bs-config.json file. My index.html opens correctly in a new tab when starting lite server using :

npm run dev

This console info might help:

> [email protected] dev C:\test\lite
> lite-server

Did not detect a `bs-config.json` or `bs-config.js` override file. Using lite-server defaults...
** browser-sync config **
{ injectChanges: false,
  files: [ './**/*.{html,htm,css,js}' ],
  watchOptions: { ignored: 'node_modules' },
  server: { baseDir: './', middleware: [ [Function], [Function] ] } }
[Browsersync] Access URLs:
 -------------------------------------
       Local: http://localhost:3000
    External: http://192.168.1.39:3000
 -------------------------------------
          UI: http://localhost:3001
 UI External: http://localhost:3001
 -------------------------------------
[Browsersync] Serving files from: ./
[Browsersync] Watching files...
19.07.26 21:02:27 304 GET /index.html
[Browsersync] Reloading Browsers...

When changing and saving my index.html,

[BrowserSync] 'Reloading Browsers'

appears in my console, but my page won't reload. I need to press F5 and then

19.07.26 21:09:32 200 GET /index.html

appears in my console.

Package.json :

{
  "name": "lite",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
      "dev": "lite-server"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "lite-server": "^2.5.3"
  }
}

How do I get Lite Server to hot reload my page ?

browser-synclite-serverhot-reload


Solution 1:[1]

I found the solution

"browser-sync" only works when there is the tag "body"

Just add body tag in your html page

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Dharman

Related Questions