如何使用“浏览器”方法强制webpack加载库？

Question

我正在尝试将使用bower和usemin的遗留项目迁移到webpack 4.第一步，我想创建所有JavaScript代码的捆绑包。为此，我创建了index.js，我将所有脚本放在这个表单中

window.moment = require('./bower_components/moment/moment.js');
require('imports-loader?define=>false,this=>window!' +
    './bower_components/moment-timezone/builds/moment-timezone-with-data-2010-2020.js');

我为传统库使用导入和导出加载器。我的问题是有些库试图加载/导入这样的依赖项

(function (root, factory) {
    "use strict";

    /*global define*/
    if (typeof define === 'function' && define.amd) {
        define(['moment'], factory);                 // AMD
    } else if (typeof exports === 'object') {
        module.exports = factory(require('moment')); // Node
    } else {
        factory(root.moment);                        // Browser
    }
}(this, function (moment) {
...
}

当webpack试图加载这样的库时，第二个if子句给true和webpack尝试使用require()语句加载依赖。

使用imports-loader?define=>false我可以强制库不要尝试AMD方法。但我无法弄清楚如何跳过使用require()的方法。我试图使用imports-loader?define=>false,exports=>false但它不起作用。

是否可以禁用Node方法？例如，设置导出到false。

我也尝试在webpack配置中使用resolve.alias: {'libname', 'path/to/lib'}选项。但是这种方式在某些情况下导致webpack尝试导入依赖两次或更多次并且它破坏代码的情况。

Answer 1

你必须将exports设置为false：

require('imports-loader?define=>false,exports=>false,this=>window!' +
    './bower_components/moment-timezone/builds/moment-timezone-with-data-2010-2020.js');

这应该使typeof exports === 'object'条件为假。