Question

我跟随Webpack guide。我这样导入了lodash：

import _ from 'lodash';

它按预期工作，但有一些不清楚的地方。指南声称在这种情况下全局范围不会受到lodash的影响，但似乎并非如此。

在此设置中，index.js明确要求存在lodash，并将其绑定为_ （无全局范围污染）。通过声明模块需要哪些依赖项，webpack可以使用此信息来构建依赖关系图。然后，它使用该图生成一个优化的包，其中脚本将以正确的顺序执行。

在Chrome的控制台中，我仍然可以访问lodash：

console.log(_, _.join, window._.join);

所有这些都是有效的，所以很明显lodash实际上污染了全球范围。

是因为lodash明确地将自己分配给window还是其他东西？

Answer 1

查看lodash v4.17.5源代码，很明显lodash正在向全局范围添加_。

/*--------------------------------------------------------------------------*/

  // Export lodash.
  var _ = runInContext();

  // Some AMD build optimizers, like r.js, check for condition patterns like:
  if (typeof define == 'function' && typeof define.amd == 'object' && define.amd) {
    // Expose Lodash on the global object to prevent errors when Lodash is
    // loaded by a script tag in the presence of an AMD loader.
    // See http://requirejs.org/docs/errors.html#mismatch for more details.
    // Use `_.noConflict` to remove Lodash from the global object.
    root._ = _;

    // Define as an anonymous module so, through path mapping, it can be
    // referenced as the "underscore" module.
    define(function() {
      return _;
    });
  }
  // Check for `exports` after `define` in case a build optimizer adds it.
  else if (freeModule) {
    // Export for Node.js.
    (freeModule.exports = _)._ = _;
    // Export for CommonJS support.
    freeExports._ = _;
  }
  else {
    // Export to the global object.
    root._ = _;
  }
}.call(this));

话虽如此，您似乎可以使用_.noConflict()从全局范围中移除_。

Webpack和全球范围的污染

1 个答案: