Sign up for Digital Ocean VPS and get $10 credit FREE!

Zero Configuration Live Reload Server2 min read

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.

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

Related Posts

Webdev News

Loading...
    More News