webpack-livereload-plugin
Advanced tools
LiveReload when running webpack --watch
Install the package
# for webpack 4
npm install --save-dev webpack-livereload-plugin
# for webpack 3
npm install --save-dev webpack-livereload-plugin@1
Add the plugin to your webpack config
// webpack.config.js
var LiveReloadPlugin = require('webpack-livereload-plugin');
module.exports = {
plugins: [
new LiveReloadPlugin(options)
]
}
Add a script tag to your page pointed at the livereload server
<script src="http://localhost:35729/livereload.js"></script>
protocol - (Default: protocol of the page, either http or https) Protocol for livereload <script> src attribute valueport - (Default: 35729) The desired port for the livereload serverhostname - (Default: hostname of the page, like localhost or 10.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 means
ignore nothing.delay - (Default: 0) amount of milliseconds by which to delay the live reload (in case build takes longer)Yes, there's already webpack-dev-server that handles live reloading
and more complex scenarios. This project aims to solve the case where
you want assets served by your app server, but still want reloads
triggered from webpack's build pipeline.
If you set key, cert, or pfx options, they'll get passed through to
tiny-lr as options and it will
serve over HTTPS. You'll also also set protocol to https.
FAQs
Livereload for webpack
The npm package webpack-livereload-plugin receives a total of 55,602 weekly downloads. As such, webpack-livereload-plugin popularity was classified as popular.
We found that webpack-livereload-plugin demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
A malicious npm package disguised as a WhatsApp client is exploiting authentication flows with a remote kill switch to exfiltrate data and destroy files.
Security News
PyPI now supports digital attestations, enhancing security and trust by allowing package maintainers to verify the authenticity of Python packages.
Security News
GitHub removed 27 malicious pull requests attempting to inject harmful code across multiple open source repositories, in another round of low-effort attacks.