将imports-loader和exports-loader与覆盖模块变量的库链接起来答案

【问题标题】：chaining imports-loader and exports-loader with a library that overwrites the module variable将imports-loader和exports-loader与覆盖模块变量的库链接起来
【发布时间】：2018-04-07 05:38:01
【问题描述】：

我正在尝试加载一个名为 libvorbis.js 的音频编码库，它是 vorbis 的 emscripten 编译版本。

libvorbis.js 需要在其作用域内使用 window 变量执行，并将类作为 var 公开而没有导出声明。

通常链接imports-loader 和exports-loader 来获取这样的文件很容易。使用-

require 'imports-loader?this=>window!exports-loader?VorbisMediaRecorder!libvorbis.js/build/libvorbis.js'

它将在 libvorbis.js 中将窗口对象公开为“this”，并将 VorbisMediaRecorder 作为返回到 this，这是我的其他模块/代码稍后运行所需要的。

但是，libvorbis.js 本身会覆盖“模块”变量，这会破坏 export-loader 的导出

libvorbis.js 在它的代码中有这个检查

// node.js Environment
var module;
if (module && module.exports) {
    makeVorbisEncoderModule({}, module);
}

// Web Worker Environment
if (!module && this.document === undefined) {
    VorbisWorkerScript.main(this);
}

这会覆盖导致 webpack 抛出此错误的模块

commons.js:142 TypeError: Cannot set property 'exports' of undefined

因为它正在尝试运行

/*** EXPORTS FROM exports-loader ***/
module.exports = VorbisMediaRecorder;

关于如何解决此问题的任何想法？我真的不想 fork libvorbis 并修改它的源代码。

libvorbis.js 库被编写为作为脚本包含在页面上。

【问题讨论】：

标签： javascript webpack emscripten vorbis webpack-loader

【解决方案1】：

所以我使用文件加载器解决了我的特殊问题。它会像加载带有 src 等文件的文件一样加载脚本......因此它可以毫无问题地运行。

# libvorbis must be resolved in window scope, use the file-loader
require 'file-loader?name=[name].[ext]!libvorbis.js/build/libvorbis.js'

【讨论】：