javascript - 如何明确导入但保留前缀语法？

Question

我读了here import * as blah from 'blah' 不是最好的主意，因为它导入了所有内容，这会使您的 JS 文件膨胀。我推测因为 Javascript 不是类型化的，所以未使用的函数很难优化掉。

首先，这是真的吗，或者我不应该担心这个，因为“webpack”(我认为这是构建我的 React 应用程序的东西)只会删除所有未使用的函数？

其次，如果我真的应该避免 import * as blah from 'blah'，我该如何更改它以便我只导入我需要的函数而不重构我的所有代码？我更愿意保留 blah.??? 语法，但是 import { alice, bob } as blah from 'blah' 不起作用并且 import { alice, bob } from 'blah' 破坏了我以前引用 blah.alice 的所有代码，但现在只是更改为仅 alice (我实际上更喜欢这个函数集合的前缀语法。

Answer 1

我能想到的最好的事情是制作你自己的对象并确保它与导入保持同步

// blah.js
const alice = () => "alice";
const bob = () => "bob";
const charlie = () => "charlie";

export { alice, bob, charlie };

// index.js
import { alice, bob } from "./blah";
const blah = { alice, bob };
// Even better, do this:
// const blah = Object.freeze({ alice, bob });
// to avoid accidentally rewriting the methods

console.log(blah.alice());
console.log(blah.bob());

您可以在 CodeSandbox here 中看到这个工作

这绝对是最简单的解决方案，但可能不是最好的。但是，它确实得到了预期的结果。