Universal Reloader

Universal reloader is a command line tool that refreshes your browser window when you change a file.

Why use it?

This tools aims to be simple to use and compatible with almost anything.

• It works with your editor or IDE
• It works with your web server

Quick Start

Execute:

npm install -g universal-reloader

Navigate to the directory you want to watch. Execute:

universal-reloader --port 8080 --url http://your-dev-server-goes-here

Navigate to http://localhost:8080.

Save a change to one of your files and watch your browser reload.

How does it work?

• You run the program on the command line
• It hosts your page in an iframe or by reverse proxy
• It opens a websocket
• It watches the filesystem
• You open your browser to Universal Reloader's webpage
• You open a file and make a change
• Your browser refreshes automatically

Usage

npm install -g universal-reloader

Then you can run:

universal-reloader [arguments]

--debounce, -d Debounce interval for throttling websocket publications. [default: 100] --folder, -f Root folder to watch for changes. [default: "."] --host, -h Method to use to host your url: iframe or proxy. [default: "proxy"] --mask, -m Pipe-delimited file patterns to watch (e.g., /*.css|/.html). [default: "**/"] --port, -p Port to run on. [default: 8080] --recent, -r Interval of checks to the most-recently modified file. [default: 100] --url, -u Url to auto-reload on file changes (e.g., http://example.com). [required] --verbose Toggle verbose logging.

For example, the following would watch all js and css while hosting http://example.com at http://localhost:8080:

universal-reloader --mask "**/*.js|**/*.css" --url http://example.com

Limitations

Using --host iframe, sites that publish an "X-Frame-Options: SAMEORIGIN" header won't work with universal-reloader.

License

MIT