1. Expose Loader

expose loader将模块添加到全局对象中。这对于调试非常有用，或者 支持依赖于全局库的库.

1.1. 安装

npm i expose-loader --save

1.2. 用法

[info] 注：

模块必须在您的bundle内被require()，否则它们不会被暴露。

require("expose-loader?libraryName!./file.js");
// 将file.js的出口暴露给全局上下文的属性`libraryName`.
// 在浏览器中，window.libraryName是可用的。

例如，假设您希望将jQuery暴露为一个全局变量$:

require("expose-loader?$!jquery");

因此,window.$然后在浏览器控制台中是可用的。

另外，您可以将其设置为配置文件:

webpack v1 用法

module: {
  loaders: [
    { test: require.resolve("jquery"), loader: "expose-loader?$" }
  ]
}

webpack v2 用法

module: {
  rules: [{
          test: require.resolve('jquery'),
          use: [{
              loader: 'expose-loader',
              options: '$'
          }]
      }]
}

假设除了window.$还希望将它暴露为window.jQuery。

你可以在loader字符串中使用!来expose多个:

webpack v1 usage

module: {
  loaders: [
    { test: require.resolve("jquery"), loader: "expose-loader?$!expose-loader?jQuery" },
  ]
}

webpack v2 用法

module: {
  rules: [{
          test: require.resolve('jquery'),
          use: [{
              loader: 'expose-loader',
              options: 'jQuery'
          },{
              loader: 'expose-loader',
              options: '$'
          }]
      }]
}

require.resolve 是一个Node.js 调用(与webpack处理的 require.resolve 不相关). require.resolve 给出了这个模块的绝对路径("/.../app/node_modules/react/react.js")。 因此，expose 只适用于React模块。它只在bundle中使用时才会被暴露出来。

1.3. 维护者

Juho Vepsäläinen

Joshua Wiens

Kees Kluskens

Sean Larkin