javascript - Webpack 和外部库

Question

我正在尝试 webpack ( http://webpack.github.io/ )，它看起来非常好，但是我有点卡在这里。

假设我将 CDN 用于库 f.ex jQuery。然后在我的代码中，我希望require('jquery')自动指向全局 jquery 实例，而不是尝试从我的模块中包含它。

我试过使用像这样的插件IgnorePlugin：

new webpack.IgnorePlugin(new RegExp("^(jquery|react)$"))

这适用于忽略库，但它仍然说当我运行 webpacker 时所需的模块“丢失”。

不知何故，我需要告诉 webpackjquery应该从全局上下文中获取。似乎是一个常见的用例，所以我有点惊讶文档没有专门针对这个。

score 81 · Accepted Answer

根据Webpack 文档，您可以使用externalsconfig 对象上的属性“来指定您的库的依赖项，这些依赖项不是由 webpack 解析，而是成为输出的依赖项。这意味着它们是在运行时从环境中导入的 [原文如此]。 "

该页面上的示例使用 jQuery 很好地说明了这一点。简而言之，您可以使用普通 CommonJS 样式的 jQuery：

var jQuery = require('jquery');

然后，在您的配置对象中，使用该externals属性将 jQuery 模块映射到全局jQuery变量：

{
    externals: {
        // require("jquery") is external and available
        //  on the global var jQuery
        "jquery": "jQuery"
    }
}

Webpack 创建的结果模块将简单地导出现有的全局变量（为简洁起见，我在这里省略了很多内容）：

{
    1: function(...) {
        module.exports = jQuery;
    }
}

我试过了，它就像描述的那样工作。

1 回答 1