Zero Configuration Live Reload Server

Share:
Source Code

This tutorial will go over how we can set up a live reload server to serve a static HTML project directory.  If you ever come across a situation where you need to rapidly prototype something but didn’t want to get yourself involved with complicated process of modern day front-end tooling, then this little tool is for you.

live-server is a node module that can be installed as a global command line tool to instantly start a server and serve your project directory with live reloading capabilities.

Setting it up is as simple as:

npm install -g live-server
cd myProjectFolder
live-server

and you will instantly have a live server running. The live server tool is very flexible as well, it accepts various command line parameters so you can tailor it to your need.

Command line parameters:

  • --port=NUMBER – select port to use, default: PORT env var or 8080
  • --host=ADDRESS – select host address to bind to, default: IP env var or 0.0.0.0 (“any address”)
  • --no-browser – suppress automatic web browser launching
  • --browser=BROWSER – specify browser to use instead of system default
  • --quiet – suppress logging
  • --open=PATH – launch browser to PATH instead of server root
  • --watch=PATH – comma-separated string of paths to exclusively watch for changes (default: watch everything)
  • --ignore=PATH – comma-separated string of paths to ignore
  • --ignorePattern=RGXP – Regular expression of files to ignore (ie .*\.jade)
  • --entry-file=PATH – serve this file in place of missing files (useful for single page apps)
  • --mount=ROUTE:PATH – serve the paths contents under the defined route (multiple definitions possible)
  • --spa – translate requests from /abc to /#/abc (handy for Single Page Apps)
  • --wait=MILLISECONDS – wait for all changes, before reloading
  • --htpasswd=PATH – Enables http-auth expecting htpasswd file located at PATH
  • --cors – Enables CORS for any origin (reflects request origin, requests with credentials are supported)
  • --https=PATH – PATH to a HTTPS configuration module
  • --proxy=ROUTE:URL – proxy all requests for ROUTE to URL
  • --help | -h – display terse usage hint and exit
  • --version | -v – display version and exit

Resources:

  • tapio/live-server: A node module to create simple development http server with live reload capability.
Comments Or Questions? Discuss In Our Discord

If you enjoyed this tutorial, make sure to subscribe to our Youtube Channel and follow us on Twitter @pentacodevids for latest updates!

More from PentaCode