忽略 Webpack 中的特定 require()？

Question

我有一个可与 NodeJS 和浏览器互操作的库，并且两者都通过 Webpack 运行以生成最终包。我遇到的问题是 Webpack 会将所有 require() 语句重写为 __webpack_require__() 并尝试捆绑库，这不适用于 fs 和 worker_threads 之类的东西。在给定特定输入字符串的情况下，如何让它忽略某些 require()s 和相关机制（require.resolve()、import 等）？

我读到我可以使用webpack.IgnorePlugin，但我不希望用户必须在他们的构建中为我的库添加特殊规则。我自己也无法让它工作，它仍然重写了require()s。我也读过我可以做到eval('require("fs")') 但这似乎很老套，但如果这真的是最好的方法，我愿意这样做。

例子：

//example.js
if(typeof window !== "undefined") {
    //Browser
    var myWorker = new Worker();
}
else {
    //NodeJS
    var Worker = require("worker_threads"); //I want Webpack to keep this line as-is
    var myWorker = new Worker();
}

Answer 1

要在与 Webpack 捆绑后在您的代码中保持原样调用 require，只需将 require 替换为 __non_webpack_require__。因此，您的示例将如下所示：

if (typeof window !== "undefined") {
    var myWorker = new Worker();
}
else {
    var Worker = __non_webpack_require__("worker_threads");
    var myWorker = new Worker();
}

这是 Webpack 的一个隐藏功能（可能是因为它不经常使用）发现 here 忽略了 require 调用，因此可以在应用程序运行时而不是捆绑时评估它们。

请注意，这不应该用于针对 Web 浏览器的应用程序，因为它会导致使用 resolve，并且 Web 浏览器不知道 resolve 是什么。仅在以 Node 为目标的代码中使用它。