JavaScript - 使用命名空间导入会对模块的 treeshake 能力产生影响吗？

Question

原始问题：JavaScript - 使用命名空间导入会对模块的 treeshake 能力产生影响吗？

假设我们使用ES6模块系统。根据 docs，当我们使用 * 作为别名导入时，我们将从文件中获取所有导出并将它们包含在别名名称的对象内。

我想知道这是否对导入模块的树可震动性有任何影响？

如果是这样，在这方面命名和默认导入是否更好？

Answer 1

理论上来说不是。实际上，它可能会影响树摇晃。

理论上，它不应该产生影响，因为捆绑器应该能够找到使用模式并进行树摇动。

但在实践中，存在两个挑战。第一个是调用点的问题，例如：

import { resultOfSomeCalculation } from './other.js';
import * as all from './all.js';

const key = resultOfSomeCalculation();


export function getData() {
  return all[key]();
}

在此示例中，捆绑包无法静态地确定，即在编译时将调用哪个函数，因此它最终将所有内容捆绑在一起。

第二个挑战是捆绑器本身的实现。当您有多个嵌套的命名空间导入和桶式导出时，它会迅速螺旋式上升。有很多边缘情况。它适用于更简单的情况，但不适用于这些深度嵌套的导入。

因此，使用命名空间导入进行树摇动是有限制的。另外，不要仅仅为了进行树摇动而避免命名空间导入。 Tree Shaking 是优化目标，而不是最终结果。如果它使代码可读，请随意使用命名空间导入。