如何使用 ES6 模块分配命名空间?我想用 jQuery 做例子,其中命名空间是
$
,但按照预期的 ES6 方式进行。我的所有模块都构建在单独的文件中,这些文件默认导出类/函数/任何内容(例如export default class Pikachu
)。如何将其导入到另一个(主)文件中,以便用户可以使用例如访问此类Namespace.Pikachu
?
我开始明白这可能与命名导出有关,但我不太确定如何做。请问有什么帮助吗?
如果使用模块,则不需要命名空间。
命名空间的目的是防止定义相同名称的不同文件之间发生冲突。
模块通过让调用站点选择一个名称来给出它需要的每个模块,从而完全消除了这个问题。
您只需导出一个包含您想要的内容的简单对象,其他文件可以将其导入到他们选择的任何名称。
这是一个老问题,有一个公认的答案,但我觉得应该提到模块名称空间在某种程度上仍然受到支持。通过“*”从模块导入所有导出的变量总是会创建这样的命名空间。 (请参阅 MDN 上的此处)
import * as Namespace from "./myModule.js";
console.log(Namespace.Pikachu);
同样,动态导入总是返回模块命名空间的 Promise:
const Namespace = await import("./myModule.js");
console.log(Namespace.Pikachu);
有关命名空间是什么样的对象的更多详细信息,请参阅this SO answer
第三种选择是创建模块中已有的命名空间并将其设为默认导出:
// within "./myModule.js"
export default {Pikachu, otherVariable, ...};
// within the other module
import Namespace from "./myModule.js";
console.log(Namespace.Pikachu);