在 Node 中使用 ES 模块加载

随着前端技术的不断发展，ES 模块已经成为了一种通用的模块化方案。在 Node 中使用 ES 模块加载可以带来很多好处，比如更加清晰的代码结构，更好的可维护性和更高的复用性。本文将详细介绍如何在 Node 中使用 ES 模块加载，并提供一些示例代码，以帮助读者更好地理解和应用这种技术。

环境准备

在使用 ES 模块加载之前，我们需要确保当前环境支持该特性。首先需要确认 Node 版本是否大于等于 13.2.0：

---- ---------

接着，在项目根目录下创建 package.json 文件，并添加以下内容：

-
  ------- --------
-

这个配置项告诉 Node 使用 ES 模块方式加载模块，而非 CommonJS 方式。

加载 ES 模块

Node 中使用 ES 模块加载与在浏览器中使用相似，通过 import 关键字进行加载：

-- -------
------ -------- ------ -- -
  ------ - - --
-

-- -------
------ - --- - ---- ------------
------------------ ---- -- ------- -

需要注意的是，在 Node 中需要使用文件扩展名 .js，否则 Node 会认为它是一个目录：

------ - --- - ---- --------- -- ---------- ---
------ - --- - ---- ------------ -- -----

如果是加载 Node 内置模块，则不需要添加扩展名：

------ ---- ---- -------

处理循环依赖

与 CommonJS 不同，ES 模块加载直接支持循环依赖，但需要注意的是，循环依赖可能导致模块未定义或引用错误。因此，在处理循环依赖时，需要遵守以下原则：

• 尽量避免循环依赖；
• 在需要时使用动态导入。

下面是一个简单的例子，演示了循环依赖的问题：

-- ----
------ - ----- - ---- ---------
------ -------- ------- -
  ---------------------
-
--------

-- ----
------ - ----- - ---- ---------
------ -------- ------- -
  ---------------------
-
--------

在执行 node a.js 时，Node 会抛出以下错误：

--------------- ------ ------ ------- ------ --------------

这是因为在 a.js 中调用了 funcB()，但此时 b.js 还没有完成初始化，所以 funcB 还未定义。

解决这个问题的方法是，将 funcB() 放在 a.js 的末尾，这样 funcB 已经定义了：

-- ----
------ - ----- - ---- ---------
------ -------- ------- -
  ---------------------
-
--------

-- ----
------ - ----- - ---- ---------
------ -------- ------- -
  ---------------------
-

但这种方法并不总是适用，特别是在循环依赖较为复杂时。在这种情况下，可以使用动态导入来处理循环依赖：

-- ----
------ ----- -------- ------- -
  ----- - ----- - - ----- -----------------
  ---------------------
  --------
-

-- ----
------ ----- -------- ------- -
  ----- - ----- - - ----- -----------------
  ---------------------
  --------
-

利用 ES 模块的动态导

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/10267