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

Question

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

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

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

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

Answer 1

从理论上讲，事实并非如此。在实践中，它可能会影响树木的晃动。

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

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

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

const key = resultOfSomeCalculation();


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

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

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

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