ES6中的静态导入是什么意思？

Question

  

与CJS相比，ESM的一个主要优势是ESM的功能-和   鼓励使用一种静态导入依赖项的方法。静态的   导入大大提高了模块的自检功能   系统，可以对其进行静态和词法分析   来自系统中每个模块的抽象语法树（AST）

— Mastering Modular JavaScript by Nicolas Bevacqua

我不明白这一点，有人可以帮忙吗？

Answer 1

JavaScript的本机模块（到目前为止，在ES2015到ES2018中），有时也称为ESM（ E CMA S cript M odule），要求导入在任何控制流语句之外的模块顶层进行描述。这是有效的：

import foo from "./mod.js";

这是静态导入。

这无效：

// Invalid
if (someCondition) {
    import foo from "./mod1.js";
} else {
    import foo from "./mod2.js";
}

这是动态导入；您要导入的内容取决于运行时确定的条件。

CommonJS（CJS，Node.js使用其变体）允许动态导入：

// Valid CommonJS
let foo;
if (someCondition) {
    foo = require("./mod1.js");
} else {
    foo = require("./mod2.js");
}

静态导入帮助工具允许他们了解模块之间的依赖性，而无需运行代码。可以静态分析。

请注意，在JavaScript的本机模块中也有一个Stage 3 proposal允许动态导入，这很可能会取得进展，因为有些边缘情况可以通过动态导入来最好地解决（例如：特定于语言的i18n模块）。