webpack-load-plugins
Install
$ npm install --save-dev webpack-load-plugins
Usage
Given a package.json
file that has some dependencies within:
Adding this into your webpack.config.js
:
var webpack = ;var webpackLoadPlugins = ;var plugins = ;
Or, even shorter:
var plugins = ;
Will result in the following happening (roughly, plugins are lazy loaded but in practice you won't notice any difference):
pluginsclean = ;pluginshtml = ;
You can then use the plugins just like you would if you'd manually required them, but referring to them as plugins.name()
, rather than just name()
.
This frees you up from having to manually require each webpack plugin.
Options
You can pass in an object of options that are shown below: (the values for the keys are the defaults):
;
Renaming
You can pass in an object of mappings for renaming plugins. For example, imagine you want to load the
html-webpack-plugin
plugin, but want to refer to it as just html
:
;
Note that if you specify the renameFn
options with your own custom rename function, while the rename
option will
still work, the replaceString
and camelize
options will be ignored.
npm Scopes
webpack-load-plugins
comes with npm scope support.
The major difference is that scoped plugins are accessible through an object on plugins
that represents the scope.
For example, if the plugin is @savl/webpack-test-plugin
then you can access the plugin as shown in the following example:
var plugins = ;pluginssavl;
Credit
Credit largely goes to @jackfranklin for his gulp-load-plugins plugin & @sindresorhus for his load-grunt-plugins plugin. This plugin is almost identical, just tweaked slightly to work with Webpack and to expose the required plugins.