在 1 个 ES6 模块中封装多个 JavaScript 文件的好习惯是什么？

Question

考虑到 C#/C++ 打包结构，我如何实现将单个文件中的 JS-classes 全部导入为单个名称 space？

我目前的解决方案是使用一个额外的 "package"-script 文件，然后封装所有 classes。请参阅下面的代码。

这似乎包括很多开销（用每个新的 class 更新 package-script-exports，在每个新的 class 中导入这个脚本）。

ClassA.js:

import * as MyPackage from "../MyPackage.js";

export default class ClassA {/* some Class Code */}

export {
    ClassA
};

MyPackage.js:

import ClassA from "./module/ClassA.js";
import ClassB from "./module/ClassB.js";

export {
   ClassA,ClassB
}

script.js:

import * as MyPackage from "./MyPackage.js"

let a = new MyPackage.ClassA();

最佳做法是什么？

Answer 1

My currently working solution is to use an additional "package"-script file, which then encapsulates all classes.

是的，这是最佳做法。 "package" 脚本文件通常被称为 index.js，放置在包的目录中，因为这是导入时文件夹路径解析的内容。

importing this script in every new class

不，你不应该那样做。它引入了循环依赖。只要您的模块不依赖于任何其他 classes，它就不应导入任何内容。没有"package declaration"，模块是独立文件，有自己的依赖。

另请注意，您不应从模块中导出 class 两次，默认导出就足够了。所以你会使用

// mypackage/classA.js:

export default class ClassA {
    /* some Class Code */
}

// mypackage/index.js:

export { default as ClassA } from "./classA.js";
export { default as ClassB } from "./classB.js";
// your solution of importing, then exporting works as well.

// script.js:

import * as MyPackage from "./mypackage";
const a = new MyPackage.ClassA();

// or

import { ClassA } from "./mypackage";
const a = new ClassA();

在 1 个 ES6 模块中封装多个 JavaScript 文件的好习惯是什么？

What is a good practice to encapsulate multiple JavaScript files within 1 ES6 module?

javascript

es6-modules