专栏首页京程一灯Node.js 中的ES模块现状[每日前端夜话0x8D]

Node.js 中的ES模块现状[每日前端夜话0x8D]

正文共:2799 字

预计阅读时间:10 分钟

作者:Tobias Nießen

翻译:疯狂的技术宅

来源:jaxenter

几乎每种编程语言都能将组成程序的代码拆分为多个文件。在 C 和 C++ 中 #include 指令就用于这个目的,而 Java 和 Python 有 import 关键字。JavaScript 是迄今为止为数不多的例外之一,但新的 JavaScript 标准(ECMAScript 6)通过引入所谓的 ECMAScript 模块来改变这一点。所有主流浏览器都支持这个新标准 —— 只有 Node.js 似乎落后了。这是为什么?

新的 ECMAScript(ES)模块与以前的语言版本不完全兼容,因此使用的 JavaScript 引擎需要知道每一个文件是“旧” JavaScript 代码还是“新”模块。

例如在 ECMAScript 5 中引入的许多程序员首选的严格模式曾经是可选的,必须明确启用才行,同时它在 ES 模块中始终处于活动状态。因此,以下代码段在语法上可以解释为传统的 JavaScript 代码和 ES 模块:

1a = 5;

作为经典的 Node.js 模块,这相当于 global.a = 5,因为未声明变量 a 并且未明确激活严格模式,因此 a 被视为全局变量。如果你尝试加载与 ES 模块相同的文件,则会收到错误 “ReferenceError:a is not defined”,因为未声明的变量可能无法在严格模式下使用。

浏览器通过<script> 标记的扩展解决了区别问题:没有 type 属性或带有 type="text/javascript" 属性的脚本仍然在传统模式下运行,而当脚本使用 type ="module" 属性时则作为模块处理。由于这种简单的分离,现在所有流行的浏览器都支持新的模块。Node.js 中的实现要困难得多:2009年发明的 JavaScript 应用程序框架使用 CommonJS 标准模块,该标准基于 require 函数。此函数可以随时根据其相对于当前运行模块的路径加载另一个模块。新的 ES 模块也是由它们的路径定义的,但是 Node.js 是如何知道正在加载的模块是遗留的 CommonJS 还是 ES 模块的呢?仅仅基于语法是不够的,因为即使不使用新关键字的 ES 模块也不兼容CommonJS模块。

此外,ECMAScript 6 还提供了可以从 URL 加载模块,而 CommonJS 仅限于文件的相对和绝对路径。这种创新不仅使加载更复杂,而且可能更慢,因为 URL 不需要指向本地文件。特别是在浏览器中,脚本和模块通常通过HTTP网络协议加载。

CommonJS 允许通过 require 函数加载模块,该函数返回加载的模块。例如,CommonJS 模块可能如下所示:

1const { readFile } = require('fs');
2const myModule = require('./my-module');

这不是 ECMAScript 6 中的一个选项,因为在 require() 调用期间,模块在 HTTP 上加载时可能会长时间阻止整个程序的执行。相反,ES 模块提供了两种加载其他模块的方法。在大多数情况下,使用 import 是有意义的:

1import { readFile } from 'fs';
2import myModule from './my-module';

但是,这会不可避免地延迟模块的执行,直到加载 fs./my-module,但它们不会阻止其他模块的执行。当模块必须动态加载时,会变得更加复杂。CommonJS 模块中看起来微不足道的东西变得越来越难以异步:

1if (condition) {
2  myOtherModule = require('./my-other-module');
3}

ECMAScript 希望通过功能性使用 import 关键字来解决这个问题,该关键字异步加载模块并在每次调用时返回 Promise 对象。但缺点是程序员现在也负责错误处理,因为错误不会像在同步情况下那样自动传给调用者。

 1if (condition) {
 2  import('./my-other-module.js')
 3  .then(myOtherModule => {
 4    // Module was loaded successfully and can
 5    // now be used here.
 6  })
 7  .catch(err => {
 8    // An error occurred that needs to be handled here.
 9    console.error(err);
10  });
11}

如果使用 async 关键字声明了要加载模块的函数,由于 ECMAScript 6 中引入了 await 函数,import() 的使用更加清晰,并且错误处理被传递给同步执行中的调用者:

1if (condition) {
2  myOtherModule = await import('./my-other-module');
3}

import 作为一个函数使用,它不是 ECMAScript 6 的一个组件,而是一个所谓的 Stage 3 提案,有可能会在下一个 JavaScript 版本中标准化。此外 Firefox、Chrome 和 Safari 等许多浏览器以及 Node.js 都支持它。

在Node.js中使用

区分 CommonJS 和 ES 模块的难度导致在 Node.js 下为 ES 模块引入了新的文件扩展名:如果已设置了 -experimental-modules 选项, Node.js 可以把以 .mjs 结尾的文件作为 ES 模块进行加载。从 2017 年 9 月发布的 Node.js 8.5.0 开始,如果将以下代码保存为 testmodule.mjs,则可以用 node -experimental-modules testmodule.mjs 命令执行它:

1export function helloWorld(name) {
2  console.log(`Hallo, ${name}!`);
3}
4
5helloWorld('javascript-conference.com');

Node.js 12 扩展了对 ES 模块的支持。重要的是,现在可以用 package.json 文件,它包含了诸如包的唯一名称之类的信息。现在使用的 JSON 格式扩展了一个名为 type 的新属性。可以选择将其更改为 commonjsmodule 以确定默认情况下应加载的包中所包含的 JavaScript 文件的模式。以下配置指定了一个包 example-package,它至少必须包含 ES 模块 index.js

1{
2  "name": "example-package",
3  "type": "module",
4  "main": "index.js"
5}

像往常一样,“main” 字段指定哪个文件应该作为入口点。例如 index.js 模块可能如下所示:

1import { userInfo } from 'os';
2
3export function greet() {
4  return `Hello ${userInfo().username}!`;
5}

现在可以从其他文件加载此模块。包通常位于 node_modules 目录中各自的文件夹中。要加载刚创建的包,我们可以用以下目录结构和一个名为 main.js 的新文件:

1- main.js
2+ node_modules
3  + example-package
4    - package.json
5    - index.js

main.js 文件可以引用传统的 CommonJS 或新的 ECMAScript 模块。在这两种情况下,example-package 都不能使用通常的 require() 调用加载,因为 ECMAScript 模块必须始终异步加载。因此 CommonJS 模块必须使用 import 加载 ES 模块:

1import('example-package')
2.then(package => {
3  console.log(package.greet());
4})
5.catch(err => {
6  console.error(err);
7});

这样做的缺点是 CommonJS 模块不能像往常那样在开始时访问其他模块或软件包,但只能在事实和异步之后才能访问。执行如上所述脚本:node -experimental-modules main.js,如果入口点本身也是 ES 模块,则更容易。如果将 main.js 重命名为 main.mjs,则可以用 import

1import { greet } from 'example-package';
2console.log(greet());

因此,可以在一个应用程序中同时使用 CommonJS 和 ECMAScript 模块,但它有可能会引发混乱。因为 CommonJS 模块需要知道正在加载的模块是 CommonJS 还是 ES 模块,并且只能异步加载 ES 模块。这也适用于通过 npm 安装的软件包的加载。fscrypto 等内置模块可以通过两种方式加载。

Node.js 中的差异

除了异步加载依赖项的问题之外,Node.js 中的旧模块和新模块之间还存在进一步的差异。特别是 ES 模块中不再提供 Node.js 的特定功能,如变量 __dirname__filenameexportmodule__dirname__filename 可以根据需要从新的 import.meta 对象重建:

1import { fileURLToPath } from 'url';
2import { dirname} from 'path';
3
4const __filename = fileURLToPath(import.meta.url);
5const __dirname = dirname(__filename);

变量 moduleexports 已被删除而无需替换;这同样适用于 module.filenamemodule.idmodule.parent 等属性。同样 require()require.main 不再可用。

虽然 CommonJS 中的循环依赖关系已经通过缓存各个模块的 module.exports 对象来解决,但 ECMAScript 6 用了所谓的绑定。简而言之,ES 模块不会导出和导入值,只是对值的引用。导入此类引用的模块可以访问该值,但无法修改它。已导出引用的模块可以为引用分配新值,该值将由从该点导入引用的其他模块使用。与之前的概念相比,这有着本质的区别,后者允许在任何时间点将属性分配给 CommonJS 模块的 module.exports 对象,从而使这些更改仅部分反映在其他模块中。

根据 ECMAScript 规范,import 默认情况下不会用文件扩展名完成文件路径,因为 Node.js 之前已经为 CommonJS 模块完成了,因此必须明确说明。同样当指定的路径是目录时,行为会发生变化:import'./directory' 不会在指定的文件夹中查找 index.js 文件,而是抛出一个错误,这是 Node.js 中的标准情况。两者都可以通过传递实验选项 -es-module-specifier-resolution = node 来改变。

结论

在最近发布的 Node.js 12.1.0 中,仍然需要通过 -experimental-modules 选项显式激活 ECMAScript 模块的使用,因为它是一个实验性功能。但是,开发人员的目标是在 Node.js 12 成为新的长期支持版本之前,在没有明确激活的情况下完成此功能并支持 ES 模块,预计将会在2019年10月完成。

现有的各种 CommonJS 模块使从 CommonJS 到 ECMAScript 模块的转换变得复杂。单个程序包无法切换到 ES 模块,从而不会发生与使用 require() 加载相应程序包的现有程序和程序包不兼容的情况。像 Babel 这样的工具可以将较新的语法转换为与旧环境兼容的代码,这使转换更容易。像 Deno 这样的新框架背弃了近年来多样化的模块化系统,完全依赖于 ECMAScript 模块,这对于把 JavaScript 作为编程语言的开发,标准化模块的引入是重要的一步,为未来的改进铺平了道路。

原文:https://jaxenter.com/es-modules-node-js-status-quo-159508.html

本文分享自微信公众号 - 前端先锋(jingchengyideng),作者:疯狂的技术宅

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2019-06-26

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 当一个模块被导入两次时,会发生什么?

    然后在另一个模块 consumer 中,将上述模块 increment 导入两次:

    疯狂的技术宅
  • 怎样避免Node.js模块的日志污染程序日志

    你是否有过这样的经历,当把 logging 添加到自定义 Node 模块中,并认为自己将会从这些额外信息中受益,却发现当你将模块添加为依赖项并运行 npm in...

    疯狂的技术宅
  • JS判断单、多张图片加载完成

    在实际的运用中有这样一种场景,某资源加载完成后再执行某个操作,例如在做导出时,后端通过打开模板页生成PDF,并返回下载地址。这时前后端通常需要约定一个flag,...

    疯狂的技术宅
  • 浅谈 Node.js 模块机制及常见面试问题解答

    Node.js 模块机制采用了 Commonjs 规范,弥补了当前 JavaScript 开发大型应用没有标准的缺陷,类似于 Java 中的类文件,Python...

    用户1462769
  • 浅谈 Node.js 模块机制及常见面试问题解答

    Node.js 模块机制采用了 Commonjs 规范,弥补了当前 JavaScript 开发大型应用没有标准的缺陷,类似于 Java 中的类文件,Python...

    五月君
  • Angualr2 之 angular模块Angular 模块化提供服务特性模块 - 业务上的最佳实践(n)共享模块XxxModule.forRoot配置核心服务知识点

    Angular 模块是带有 @NgModule 装饰器的函数。 @NgModule接收一个元数据对象,该对象告诉 Angular 如何编译和运行模块代码。

    贺贺V5
  • 模块化

    在nodejs中,可以通过exports或module.exports 和 require 实现模块化 exports 和 module.exports的区别...

    河湾欢儿
  • JavaScript 模块化

    随着前端js代码复杂度的提高,JavaScript模块化这个概念便被提出来,前端社区也不断地实现前端模块化,直到es6对其进行了规范,下面就介绍JavaScri...

    grain先森
  • Node入门教程(6)第五章:node 模块化(上)模块化演进

    node 模块化 JS 诞生的时候,仅仅是为了实现网页表单的本地校验和简单的 dom 操作处理。所以并没有模块化的规范设计。 项目小的时候,我们可以通过命名空间...

    老马
  • Linux-insmod/rmmod/lsmod驱动模块相关命令(10)

    insmod:加载模块 参数: -f  不检查目前kernel版本与模块编译时的kernel版本是否一致,强制将模块载入。 -k  将模块设置为自动卸除。 -m...

    张诺谦

扫码关注云+社区

领取腾讯云代金券