Node.js module to refresh and reload your code in your browser when your code changes. No browser plugins required.
Refresh and reload your code in your browser when your code changes. No browser plugins required. Use with Node.js if you like.
Restarting your Http server and refreshing your browser is annoying.
npm install [-g] [--save-dev] reload
nodedemon time to poll for file changes is too slow and not configurable. Supervisor will feel fast.
forever tries to do too much. Whenever I look at the docs, I get frustrated and give up.
var express = require'express'http = require'http'path = require'path'reload = require'reload'var app = expressvar publicDir = pathjoin__dirname 'public'appconfigureappset'port' processenvPORT || 3000appuseexpresslogger'dev'appuseexpressbodyParser //parses json, multi-part (file), url-encodedappuseapprouter //need to be explicit, (automatically adds it if you forget)appuseexpressstaticclientDir //should cache static assetsappget'/'ressendfilepathjoinpublicDir 'index.html'var server = httpcreateServerapp//reload code herereloadserver appserverlistenappget'port'console.log"Web server listening on port " + appget'port';;
public/index.html: (very valid HTML5, watch the YouTube video)
<!--watch this:-->My sweet app!<!-- all you have to do is include the reload script -->Hello!
npm install -g supervisor
reload on any html or js file change:
supervisor -e 'html|js' node server.js
You should install
reload globally like
npm install -g reload. Then you can use the
reload command in your directory without modifying any of your HTML.
Usage: reload [options]Options:-h, --help output usage information-V, --version output the version number-b, --browser Open in the browser automatically.-d, --dir [dir] The directory to serve up. Defaults to current dir.-e, --exts [extensions] Extensions separated by commas or pipes. Defaults to html,js,css.-p, --port [port] The port to bind to. Can be set with PORT env variable as well. Defaults to 8080-t, --time [delay] How long (ms) should the browser wait before reconnecting? Defaults to 300 ms.
Navigate to your html directory:
this will open your
index.html file in the browser. Any changes that you make will now reload in the browser. You don't need to modify your HTML at all.
It's actually stupidly simple. We leverage
supervisor to restart the server if any file changes. The client side keeps a websocket open, once the websocket closes, the client sets a timeout to reload in approximately 300 ms. Simple huh?
httpServer: The Node.js http server from the module
expressApp: The express app. It may work with other frameworks, or even with Connect. At this time, it's only been tested with Express.
timeout_millis: The client side refresh time in milliseconds. Default is
Copyright 2013, JP Richardson email@example.com