我用以下檔案建立了一個小專案
- src/
- lib/
- lib1.ts
- export : func_lib1_1, func_lib1_2
- lib2.ts
- export : func_lib2_1, func_lib2_2
- pkg1/
- pkg1.ts
- import & use : func_lib1_1, func_lib2_1
- pkg2/
- pkg2.ts
- import & use : func_lib1_1
- pkg3/
- pkg3.ts
- import & use : func_lib1_1
我根據官方檔案配置了各種構建/包/優化設定：
webpack.config.js
mode: "production",
optimization: {
usedExports: true,
},
包.json
"sideEffects": false,
pkgX.ts
import { func_lib1_1 } from "../lib/lib1";
console.log("pkgX");
console.log(func_lib1_1());
但在隨后的捆綁包中，我仍然看到未使用的函式 func_lib1_2 和 func_lib2_2 被包含在內：
pkg1.bundle.js
/***/ 119:
/***/ ((__unused_webpack_module, exports) => {
Object.defineProperty(exports, "__esModule", ({ value: true }));
exports.func_lib1_2 = exports.func_lib1_1 = void 0;
function func_lib1_1() {
return "func_lib1_1";
}
exports.func_lib1_1 = func_lib1_1;
function func_lib1_2() {
return "unused, shouldn't be bundled";
}
exports.func_lib1_2 = func_lib1_2;
/***/ }),
你知道為什么嗎？我能做些什么來解決這個問題并獲得我所尋求的按部就班的搖樹？
此處提供的最小復制設定
提前致謝
更新：來自 optimizationBailout 的更多資訊：true
modules by path ./src/lib/*.ts 666 bytes
./src/lib/lib1.ts 333 bytes [built] [code generated]
Statement (ExpressionStatement) with side effects in source code at 2:0-62
ModuleConcatenation bailout: Module is not an ECMAScript module
./src/lib/lib2.ts 333 bytes [built] [code generated]
Statement (ExpressionStatement) with side effects in source code at 2:0-62
ModuleConcatenation bailout: Module is not an ECMAScript module
./src/pkg1/pkg1.ts 263 bytes [built] [code generated]
Statement (ExpressionStatement) with side effects in source code at 2:0-62
ModuleConcatenation bailout: Module is not an ECMAScript module
./src/pkg2/pkg2.ts 182 bytes [built] [code generated]
Statement (ExpressionStatement) with side effects in source code at 2:0-62
ModuleConcatenation bailout: Module is not an ECMAScript module
./src/pkg3/pkg3.ts 182 bytes [built] [code generated]
Statement (ExpressionStatement) with side effects in source code at 2:0-62
ModuleConcatenation bailout: Module is not an ECMAScript module
這很有趣。我申報出口的方式有問題嗎？
更新 2：它可以在沒有 ts-loader 的情況下作業！
我嘗試將所有文??件更改為 .js 并洗掉整個 ts-loader 東西。搖樹現在按預期作業。
現在更新的問題是：如何使它與打字稿一起作業？
類似的問題可能是相關的，但有不同的背景
- webpack 4，同樣的情況
- webpack 4，帶有變數
- webpack 4，帶匯入 *
uj5u.com熱心網友回復：
我自己想通了，自動回答記錄：
tsconfig.json 是錯誤的，它沒有保留 ES6 模塊語法，因此 webpack 不能正確地搖樹。
有關正確配置的更多詳細資訊（也可以選擇包括 Babel）可以在這里找到
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/454522.html
上一篇：WebRTC：升級時視頻閃爍