我開發了一個在瀏覽器和 Node.js 中作業的庫。在 Node.js 中執行時，該庫依賴于瀏覽器中不需要的模塊。我的庫的代碼只是執行一個簡單的特征檢測測驗，如果需要，額外的模塊會用require. 一切正常。
當有人在依賴 Webpack 的專案中使用我的庫時，就會出現問題。在這種情況下，在編譯期間，Webpack 總是捆綁模塊，即使對于不需要模塊的面向瀏覽器的專案也是如此。
作為庫開發人員，我有沒有辦法阻止 Webpack 在捆綁包將在瀏覽器中運行時捆綁模塊？
我唯一能想到的就是分發我非常想避免的兩個版本的庫。
uj5u.com熱心網友回復：
我提出了自己的解決方案。這有點駭人聽聞，但它解決了問題，而無需讓我的用戶自定義他們的 Webpack 配置。
這個想法只是隱藏來自 Webpack 的匯入。在 CommonJS 版本中，這是我正在使用的：
if (isNode) {
let mod;
eval('mod = require("some_module")');
}
在 ESM 版本中（"type": "module"在檔案中設定時package.json使用），我使用的是：
if (isNode) {
let mod = await Object.getPrototypeOf(async function() {}).constructor(`
mod = await import("some_module");
return mod.default;
`)();
}
當 Webpack 編譯代碼時，它會忽略匯入，因為它們隱藏在字串中。因此，當代碼在瀏覽器中運行時，我們只需忽略該代碼塊，當它在 Node.js 中運行時，匯入是動態執行的。
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/411430.html
標籤：
上一篇：UncaughtTypeError:xisnotafunctionwhenImportingFactoryFunction
下一篇：Gatsby構建時錯誤-WebpackError:TypeError:isRedirectisnotafunction