模块的shim其实在webpack中能够运用imports-loader和exports-loader来完成。

1.imports-loader

望文生义，导入模块的处理器。它能够做的事变包含：

• 前置插进去模块依靠，设置前置（相当于插进去各种类型数据）

• this 注入，AMD define 制止

因而，当我们运用了一些jquery插件的时刻，这些插件全局依靠了jquery（代码中显式挪用$）,直接导入jquery插件会报错，找不到$啊。

解决方案就是，将var $ = require('jquery') 前置插进去到jquery插件中。

module.exports = {
    ...
    module: {
        loaders: [
            {
                test: require.resolve("some-module"),
                loader: "imports-loader?$=jquery"
            }
        ]
    }
};

语法：

模块别号定名运用=，别的变量定名定义，运用=>语法。

多个值：

module.exports = {
    ...
    module: {
        loaders: [
            {
                test: require.resolve("some-module"),
                loader: "imports-loader?$=jquery,angular,config=>{ data: ''},this=>window,define=>false"
            }
        ]
    }
};

AMD 禁用

有许多模块在运用 CommonJS 前会举行 define 函数的搜检。自从 webpack 两种花样都能够运用后，在这类场景下默许运用了 AMD 可能会形成某些题目（假如接口的完成比较离奇）

define=>false

与ProvidePlugin的区分

ProvidePlugin重要用来省略模块（只对AMD和CMD模块有用）依靠导入写法。比方：
webpack.config.js

var provide = new webpack.ProvidePlugin({
    $: 'jquery',//key值为暴露全局的变量名，val值为模块名
    jQuery: 'jquery' 
});
config.plugins.push(provide)

a.js

//var $ = require('jquery');//能够省略咯
$('body').prepend('<p style="font-size:30px;color:#333">import loader test</p>');

因而，你的jquery文件必需支撑AMD或许CMD的模块范例，才能够运用ProvidePlugin。

2.exports-loader

重要用来将全局模块导出为commonjs花样。

module.exports = {
  module: {
    rules: [{
      test: require.resolve("some-module"),
      use: 'exports-loader?file,parse=helpers.parse' //file=file,parse=helper.parse简写
      // 在文件的源码中到场以下代码
      //  exports["file"] = file;
      //  exports["parse"] = helpers.parse;
    }]
  }
};

3.expose-loader

expose-loader 用来把模块（CMD/AMD/UMD）暴露到全局变量。

注重: 模块必需在你的 bundle 中被 require() 过，不然他们将不会被暴露。

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

总结：

1.imports-loader,ProvidePlugin,expose-loader三者之间功用比较相同,然则expose-loader须要显式require。
2.exports-loader重要用于导出commonjs模块。