Defines a LiveReload plugin that only reloads the page when JS changes if that JS is included on the page.
Depending on your build process, editing a script that is included on the page you have open may cause changes to other files that aren't included on the page—maybe you're editing a dependency of multiple build targets, or are generating sourcemaps alongside your scripts. Your build process won't know which of those files are relevant to the page, so it has to notify the LiveReload server that all of them have changed. But the LiveReload client doesn't always attempt to determine if those files require reloading the page—it does for CSS and images, but not JS.
This plugin fixes that by intercepting all changed JS and sourcemaps and only reloading if the page includes a script tag with a matching filename. (So it will never reload for a sourcemap change, the assumption there being that the sourcemap would only have changed if the JS changed too.)
(If this seems like the way that LiveReload should just work out of the box, please upvote livereload/livereload-js#59 !)
bower install livereload-require-js-includes --save-dev
(--save-dev
assumes that you're only running LiveReload for local development.)
<script src="bower_components/livereload-require-js-includes/index.js"></script>
The plugin will automatically register itself with the LiveReload client, no matter whether it loads before or after the client.
We welcome pull requests! In particular:
- I'm not sure that this supports Windows due to the way it matches paths.
- the file-matching algorithm could be improved—it currently matches files by the last path component, but should probably try to match other components like how LiveReload determines if paths match.
Please lint your code.
npm test
will open the tests in the browser.
- 1.0.1 Fix identifier.
- 1.0.0 Initial release.