Rollup Plugin Livereload

Rollup Plugin Livereload is a plugin for Rollup that reloads the browser automatically when a change is made to the code.

Installation

To install Rollup Plugin Livereload, use npm:

npm install rollup-plugin-livereload --save-dev

Usage

To use Rollup Plugin Livereload, simply include it in your Rollup configuration file:

import livereload from 'rollup-plugin-livereload';

export default {
  input: 'src/index.js',
  output: {
    file: 'dist/bundle.js',
    format: 'iife',
  },
  plugins: [
    livereload(),
  ],
};

This will automatically reload the browser when the code changes.

Options

Rollup Plugin Livereload accepts an options object as a parameter. Some of the available options include:

watch

This controls which files to watch for changes. It can be a glob pattern or an array of glob patterns.

livereload({
  watch: 'dist/**/*.js',
})

delay

This controls how long to wait before reloading the page after a change has been detected. The default is 250ms.

livereload({
  delay: 500,
})

hostname

This specifies the hostname to use for the livereload server. By default it uses localhost.

livereload({
  hostname: '0.0.0.0',
})

Conclusion

Rollup Plugin Livereload is a simple and effective way to automatically reload the browser when code changes are made. It's easy to use and configurable if you need more options. Give it a try in your next project!