Automatically load modules instead of having toimport orrequire them everywhere.

newwebpack.ProvidePlugin({  identifier:'module1',// ...});

or

newwebpack.ProvidePlugin({  identifier:['module1','property1'],// ...});

By default, module resolution path is current folder (./**) andnode_modules.

It is also possible to specify full path:

const path=require('path');newwebpack.ProvidePlugin({  identifier: path.resolve(path.join(__dirname,'src/module1')),// ...});

Whenever theidentifier is encountered as free variable in a module, themodule is loaded automatically and theidentifier is filled with the exports of the loadedmodule (orproperty in order to support named exports).

For importing the default export of an ES2015 module, you have to specify the default property of module.

Usage: jQuery

To automatically loadjquery we can point both variables it exposes to the corresponding node module:

newwebpack.ProvidePlugin({  $:'jquery',  jQuery:'jquery',});

Then in any of our source code:

// in a module$('#item');// <= worksjQuery('#item');// <= also works// $ is automatically set to the exports of module "jquery"

Usage: jQuery with Angular 1

Angular looks forwindow.jQuery in order to determine whether jQuery is present, see thesource code.

newwebpack.ProvidePlugin({'window.jQuery':'jquery',});

Usage: Lodash Map

newwebpack.ProvidePlugin({  _map:['lodash','map'],});

Usage: Vue.js

newwebpack.ProvidePlugin({  Vue:['vue/dist/vue.esm.js','default'],});

5 Contributors