Webpack和外部库

Question

我正在尝试使用webpack（http://webpack.github.io/）并且它看起来非常好，但是我有点被困在这里。

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

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

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

这适用于忽略库，但它仍然表示所需的模块是＆＃34;缺少＆＃34;当我运行webpacker时。

不知怎的，我需要告诉webpack，应该从全局上下文中选择jquery。看起来像是一个常见的用例，所以我很惊讶文档没有具体针对这一点。

Answer 1

根据Webpack documentation，你可以使用配置对象上的externals属性来指定你的库的依赖关系，这些依赖关系不是由webpack解决的，而是成为输出的依赖关系。这意味着它们在运行时[sic]从环境中导入。“

该页面上的示例使用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;
    }
}

我尝试了这一点，它的工作方式如上所述。