Webpack 4通用库目标

Question

根据Webpack 4文档,如果我指定libraryTarget:'umd',它应该产生以下输出:

(function webpackUniversalModuleDefinition(root, factory) {
  if(typeof exports === 'object' && typeof module === 'object')
    module.exports = factory();
  else if(typeof define === 'function' && define.amd)
    define([], factory);
  else if(typeof exports === 'object')
    exports["MyLibrary"] = factory();
  else
    root["MyLibrary"] = factory();
})(typeof self !== 'undefined' ? self : this, function() {
  return _entry_return_;
});

但是,我得到的是:

(function webpackUniversalModuleDefinition(root, factory) {
    if(typeof exports === 'object' && typeof module === 'object')
        module.exports = factory();
    else if(typeof define === 'function' && define.amd)
        define("lib", [], factory);
    else if(typeof exports === 'object')
        exports["lib"] = factory();
    else
        root["lib"] = factory();
})(window, function() {
return

更确切地说,而不是这个
(typeof self !== 'undefined' ? self : this, function()
我得到这个:
(window, function()

window is undefined在节点环境中导入时(显然)会导致运行时错误.

要明确:
我知道window节点应用程序中不存在.我的问题不是关于这个,而是关于webpack.

这是一个错误还是我错过了什么？

我的输出配置:

output: {
    path: resolve(__dirname, 'umd'),
    filename: 'lib.js',
    libraryTarget: 'umd',
    library: 'lib',
    umdNamedDefine: true,
},

Answer 1

这将是一个错误中的WebPack 4.
Webpack 3生成一个合适的包.

应该使用此功能修复此问题,直到完成建议的解决方法为止globalObject:

output: {
    path: resolve(__dirname, 'umd'),
    filename: 'lib.js',
    libraryTarget: 'umd',
    library: 'lib',
    umdNamedDefine: true,
    globalObject: `(typeof self !== 'undefined' ? self : this)`
},

Answer 2

根据文档包含output.globalObject到webpack.config.js 中：

module.exports = {
  output: {
    libraryTarget: 'umd',
    globalObject: 'this'
  }
}

要使 UMD 构建在浏览器和 Node.js 上都可用，请将 output.globalObject 选项设置为“this”。