webpack Shimming

在 Webpack 中，Shimming 是指在打包过程中对模块进行修改或替换的技术。通过 Shimming，我们可以在不改动源代码的情况下，对模块进行一些特定的操作，比如注入全局变量、修改模块的导出等。

使用 ProvidePlugin 插件

Webpack 提供了一个插件叫做 ProvidePlugin，可以用来在模块中自动引入特定的模块或变量，并且将其绑定到全局变量上。这样我们就可以在模块中直接使用这些全局变量，而不需要显式地引入它们。

-- -------------------- ---- -------
-- -----------------
----- ------- - -------------------

-------------- - -
  -------- -
    --- -----------------------
      -- ---------
      -- --------
    --
  -
--

在上面的例子中，我们使用了 ProvidePlugin 插件，将 jQuery 和 lodash 模块绑定到全局变量 $ 和 _ 上。这样在我们的代码中就可以直接使用 $ 和 _，而不需要手动引入这两个模块。

使用 imports-loader 和 exports-loader

除了 ProvidePlugin 插件之外，Webpack 还提供了 imports-loader 和 exports-loader 这两个 loader，用来在模块的导入和导出上进行一些操作。

-- -------------------- ---- -------
-- -----------------
-------------- - -
  ------- -
    ------ -
      -
        ----- -------------------------------
        ---- -----------------------------
      --
      -
        ----- ----------------------------------
        ---- --------------------
      -
    -
  -
--

在上面的例子中，我们使用了 imports-loader 和 exports-loader，分别对 some-module 和 another-module 进行了操作。imports-loader 用来将模块中的 this 绑定到全局对象 window 上，而 exports-loader 则用来将模块的导出改为 foo。

通过这种方式，我们可以在打包过程中对模块进行一些定制化的操作，从而达到我们想要的效果。

这就是 Webpack 中 Shimming 的基本用法，通过对模块的操作，我们可以实现一些非常灵活的功能。