Webpack - 导出方法如何影响摇树?

Question

对于实用程序函数和常量，我通常使用命名导出。

//utilities.js
export function someFunction(param){...}
export function someFunction2(param){...}

//someModule.js
import {someFunction} from "./utilities.js" 

但有时，我会将它们导出为默认对象。

//styleUtilities.js
export function someFunction(param){...}
export function someFunction2(param){...}
export default {someFunction, someFunction2}
//someModule.js
import styleUtilities from "./styleUtilities" 
const {someFunction} = styleUtilities

导出为默认对象时，是否会破坏 Webpack 中未使用值的树摇动？

Answer 1

导出为默认对象时，是否会破坏 Webpack 中未使用值的树摇动？

是的。

记住所有样式实用程序都在styleUtilities下可能很方便。

为此，您仍应在utilities.js模块中使用命名导出。然后在someModule.js中导入该模块时，使用命名空间导入语法：

import * as styleUtilities from "./utilities.js";
styleUtilities.someFunction();

这仍然允许摇树，并为模块的使用者提供导入样式的选择(而不是强迫对象在他们身上(。