rollup-webpack-loader
Bout to wrap it up, Pakistan – Riff Raff
Install
npm install rollup-webpack-loader --save-dev
Usage
In your webpack.config.js
, add the rollup-webpack-loader
:
loaders: test: /\.js$/ loader: 'rollup-webpack-loader'
Options
Although you may use the loader query string, it is recommended to use the
query
object in the loader or rollupWebpackLoader
object to configure the
rollup-webpack-loader
due to the need for passing functions in rollup.plugins
.
-
rollup
: Object containing options forrollup
function (documentation). -
generate
: Object containing options forgenerate
function (documentation).
Examples
Normal Configuration
Probably the most typical usage of Rollup:
;;; entry: output: path: filename: 'index.js' module: loaders: test: /\.js$/ loader: 'rollup-webpack-loader' query: rollup: plugins:
Babel Configuration
Although it is possible to use Webpack's babel-loader
and then use
rollup-webpack-loader
in an array of loaders
, this is not recommended. The
JavaScript that gets generated will not be properly tree-shaken and more than
likely you will run into errors. To avoid that use Rollup's plugin
rollup-plugin-babel
with babel-plugin-external-helpers
as such:
;;;;; // Temporary `babelHelpers` dependencyconst name: tmpFileName = ;; entry: 'regenerator-runtime/runtime' output: path: filename: 'index.js' module: loaders: test: /\.js$/ exclude: /node_modules/ loaders: 'rollup-webpack-loader' 'eslint-loader' eslint: configFile: rollupWebpackLoader: rollup: { if id === null return true; return false; } { if id !== null return tmpFileName; return id; } plugins:
webpack@>=2.0.0
Not tested yet.