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'条件为假。

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

1 个答案: