STEP 1: Install livereload extension into Chrome

https://chrome.google.com/webstore/detail/livereload/jnihajbhpnppcggbcgedagnkighmdlei/related

 

In browser type.....  chrome://extensions

IMPORTANT: Make sure the plug has this option on.

"Allow access to file URLs"

 

 STEP 2: Update your package.json scripts

In your package.json

  "scripts": {
    "start:dev": "nodemon server.js",
    "watch": "livereload -ee ejs -d",
  },

 

This watches for changes in the folder and child folders for files of type

html, css, js, png, gif, jpg, php, php5, py, rb, erb, coffee

ejs

 

-------

Option 2: Embed the reload server in your code.

const livereload = require("livereload");
const path = require('path')


const startLiveReload = () => {
  const liveReloadServer = livereload.createServer({
    extraExts: 'ejs',
  });
  
  liveReloadServer.watch(path.join(__dirname, "views"));
  
  liveReloadServer.server.once("connection", () => {
    setTimeout(() => {
      liveReloadServer.refresh("/");
      console.log('== Live reload server has connected ==')
    }, 100);
  });
}


module.exports = startLiveReload

 

// In server.js

const connectLiveReload = require("connect-livereload");

// Middleware
const startLiveReload = require('./middleware/livereload')
startLiveReload()
app.use(connectLiveReload());