简单描述一下 ESM 的静态结构

5 min read

ECMAScript Modules (ESM) 是 JavaScript 中用于组织和管理模块的一种标准。它们具有静态结构，意味着所有的导入和导出都在编译时解析，而不是在运行时。

在 ESM 中，你可以使用 import 和 export 语句来管理模块之间的依赖关系。

例如，你可以使用 export 语句将一个变量或函数从一个模块导出，然后使用 import 语句在另一个模块中使用它：


// moduleA.js
export const foo = 'hello';

// moduleB.js
import { foo } from './moduleA';
console.log(foo); // 'hello'

ESM 还允许你重命名导入和导出，以及使用默认导出，以使代码更具可读性和可维护性。


// moduleA.js
export const foo = 'hello';
export const bar = 'world';

// moduleB.js
import { foo as greet } from './moduleA';
import * as all from './moduleA';
console.log(greet); // 'hello'
console.log(all.foo, all.bar); // 'hello', 'world'

// moduleC.js
import greet from './moduleA';
console.log(greet); // 'hello'

我希望这对你有帮助！