sas

simple-autoreload-server

Node.js based Simple Live/Auto Reloading Web Server

Showing:

Popularity

Downloads/wk

163

GitHub Stars

35

Maintenance

Last Commit

5mos ago

Contributors

1

Package

Dependencies

9

License

MIT

Type Definitions

Tree-Shakeable

No?

Categories

Readme

simple-autoreload-server Build Status

A simple Web server on Node.js with autoreload/livereload feature.

  • Reload statically on update the html files
  • Refresh dynamically on update the files like css, js, png, and etc.
  • No browser extensions are needed. (uses only WebSocket.)
  • Broadcast handleable event on client side window.

Usage

  1. Install simple-autoreload-server via npm.

    (e.g. npm install simple-autoreload-server)

  2. Start autoreload-server from command line.

    (e.g. autoreload-server -d ./ -p 8080)

  3. Open server url with your browser.

    (e.g. iexplore http://localhost:8080/)

Installation

install this package via 'npm'.

npm install -g simple-autoreload-server

Command Line Usage

autoreload-server [options] [root-dir] [port]

Example 1

Start server with options.

autoreload-server -w "**/**.{html,css,js}" ./site-files 8008

Example 2

Start server with json instead of commandline-options.

command

autoreload-server

content of .autoreload.json

{
  "watch":  "**/**.html",
  "reload": "**/**.html",
  "mount": [
    {
      "path":   "modules/",
      "target": "/"
    }
  ],
  "inject": [
    {
      "content": "before-body.html",
      "which":   "**/**.html",
      "where":   "</body>",
      "prepend": true
    }
  ]
}

In case of using another config json file instead of ".autoreload.json", invoke command with '-c' or '--config' option. See Options.md and config.json in examples for details.

Example 3

as module.

var launcher = require('simple-autoreload-server');

var server = launcher({
  port: 8008,
  path: './',
  listDirectory: true,
  watch:  "*.{png,js,html,json,swf}"
  reload: "{*.json,static.swf}"
});

Command Line Options

optiondefaulthelp
--path, -d.set directory to publish.
--watch, -w**/**pattern for file to watch.
--reload, -rfalsepattern for file to reload the whole page.
--mount.path, -m.set additional directory to publish.
--mount.target, -t/server side path of mounted direcory
--mount.watch, -W**/**pattern of file to watch.
--host, -H0.0.0.0set host address to publish.
--port, -p8080set port to listen (http).
--config, -c.autoreload.jsonload options from json.
--search-configtruesearch for config json in parent directories.
--list-directory, -ltrueenable directory listing.
--browse, -bfalseopen server url by platform default program.
--execute, -e``execute command when the server has prepared.
--stop-on-exit, -kfalseexit when invoked process specified by "execute" died.
--ignore-case, -itrueignore case of glob patterns.
--include-hidden, -nfalseglob includes hidden files.
--default-pagesindex.{htm,html}default page file pattern for directory request.
--encodingutf-8encoding for reading texts and inject target files
--watch-delay20delay time to supress duplicate watch event (ms).
--log, -vnormalset log-level
--builtin-scripttrueenable default built-in script injection.
--client-moduletrueexpose client module to 'window' object.
--client-logfalseinform client to log.
--recursive, -Rtruewatch sub-directories recursively.
--follow-symlinks, -Lfalsefollow symbolic-links. (requires 'recursive' option)
--inject.content, -I``injects specified content.
--inject.type, -Tfiletype of "inject.content".
--inject.which, -F**/**.{htm,html}specify pattern for injection target.
--inject.where, -P`</(bodyhead
--inject.prepend, -Efalseinsert content before matched.
--help, -hfalseshow help
--version, -Vfalseshow version

See Options.md for details.

Client Module Usage

note: available only for the web page injected the built-in script module.

Client module will be exposed as window.AutoreloadClient (default).

and the module emits some events. set listener to window object to handle events.

e.g.

window.addEventListener("AutoreloadClient.update", function(ev){...});

Currently, following events are handleable on client side.

eventdesc
updatefile update detected
refreshrefresh request.
reloadreload request.
scanbefore dom element scanning.
openconnected.
closedisconnected.
messagereceived a message above.

(server will send 'update' events only the file matched to 'watch' option.)

Some of events emit another events. (chained)

eventemits
message(any events by server response)
updatescan
scanrefresh, reload
reloadrefresh (on failed or canceled)

internal operation and chain of event emission are cancelable by using "event.preventDefault()".

event listeners will receive an event object with 'detail' key. and the 'detail' object has some of parameters below.

keydesc
clientclient module instance.
pathpath of file updated.
urlurl of file updated.
typeoriginal message type from server.
scanscan target list.
reloadreload or not. (on reload event, set false to switch 'refresh')
targetdom object of refresh target.
targetUrlurl of refresh target. (url which contained as dom attribute)

and the contents of './examples' may be a useful reference for usage of client module. or see 'src/client.ls' for more information.

Version

0.2.15

License

MIT

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100
No reviews found
Be the first to rate

Alternatives

No alternatives found

Tutorials

No tutorials found
Add a tutorial