webpack-watch-livereload-plugin

Use webpack --watch to start LiveReload server.

Straightforward LiveReload can't fully replace Webpack's neat Hot Reload but it's very useful when you just need to reload browser when HTML changes.

Installation

Install the package:

npm install --save-dev sr-webpack-watch-livereload-plugin

Add the plugin to your webpack config:

// webpack.config.js
var WatchLiveReloadPlugin = require('webpack-watch-livereload-plugin');

module.exports = {
	entry: // ...
	output: // ...

	// ...

	plugins: [
		new WatchLiveReloadPlugin({
			files: [
				// Replace these globs with yours
				'./src/**/*.html',
				'./src/**/*.css',
				'./src/**/*.png',
				'./src/**/*.jpg',
				'./src/**/*.js',
			]
		}),
	]
}

Add a LiveReload script to your page pointed at the LiveReload server

<script src='//localhost:{port}/livereload.js'>

Options

• files — path, array, glob or array of globs to watch
• port — port for the LiveReload server (35729 by default)

Thanks

This plugin was inspired by webpack-livereload-plugin.