ProvidePlugin

Автоматически загружать модули вместо необходимости import или require их повсюду.

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

или

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

По умолчанию путь к модулям — текущая папка (./**) и node_modules).

Также можно указать полный путь:

new webpack.ProvidePlugin({
  identifier: path.resolve(path.join(__dirname, 'src/module1'))
  // ...
});

Всякий раз, когда identifier встречается как свободная переменная в модуле, module загружается автоматически, и identifier заполняется экспортом загруженного module (или property для поддержки именованных экспортов).

Для импорта стандартного экспорта модуля ES2015 необходимо указать свойство default модуля.

Использование: jQuery

Для автоматической загрузки jquery мы можем просто указать обе переменные, которые он предоставляет, соответствующему модулю node:

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

Затем в любом из наших исходных кодов:

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

Использование: jQuery с Angular 1

Angular ищет window.jQuery для определения присутствия jQuery, см. исходный код.

new webpack.ProvidePlugin({
  'window.jQuery': 'jquery'
});

Использование: Lodash Map

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

Использование: Vue.js

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