- Notifications
You must be signed in to change notification settings - Fork51
LiveReload during webpack --watch
License
statianzo/webpack-livereload-plugin
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
LiveReload when runningwebpack --watch
Install the package
npm install --save-dev webpack-livereload-plugin
Add the plugin to your webpack config
// webpack.config.jsvarLiveReloadPlugin=require('webpack-livereload-plugin');module.exports={plugins:[newLiveReloadPlugin(options)]}
Add a script tag to your page pointed at the livereload server
<scriptsrc="http://localhost:35729/livereload.js"></script>
protocol- (Default: protocol of the page, eitherhttporhttps) Protocol for livereload<script>src attribute valueport- (Default: 35729) The desired port for the livereload server. If you define port 0, an available port will be searched for, starting from 35729.hostname- (Default: hostname of the page, likelocalhostor10.0.2.2) The desired hostname for the appended<script>(if present) to point toappendScriptTag- (Default: false) Append livereload<script>automatically to<head>.ignore- (Default:null) RegExp of files to ignore. Null value meansignore nothing. It is also possible to define an array and use multipleanymatch patterns.delay- (Default:0) amount of milliseconds by which to delay the live reload (in case build takes longer)useSourceHash- (Default:false) create hash for each file source and only notify livereload if hash has changeduseSourceSize- (Default:false) check size for each file source and only notify livereload if size has changed (Faster thanuseSourceHashbut it has a downside. If file size hasn't changed no reload is triggered. For example if color has changed from#000000to#ffffffno reload will be triggered!)
Yes, there's alreadywebpack-dev-server that handles live reloadingand more complex scenarios. This project aims to solve the case whereyou want assets served by your app server, but still want reloadstriggered from webpack's build pipeline.
If you setkey,cert, orpfx options, they'll get passed through totiny-lr as options and it willserve over HTTPS. You'll also also setprotocol tohttps.
If your webpack is always generating js and css files together you could setuseSourceHash totrue to generate a hash for each changed asset and itshould prevent multiple reloads.
Alternatively if this slows your build process you could setliveCSSandliveImg tofalse to prevent multiple reloads.
About
LiveReload during webpack --watch
Topics
Resources
License
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Uh oh!
There was an error while loading.Please reload this page.