什么是 fesm2015 以及它与 esm2015 有何关系？

Question

我知道 esm2015 指的是ecmascript 2015 规范（模块部分）描述的 ecmascript 模块

在一些库中node_modules/，我在目录旁边看到esm2015/另一个名为fesm2015/.

• fesm2015 是什么？
• 它扩展了 esm2015吗？
• 有规范描述吗？

Answer 1

它是 Angular 包格式的一部分。

\n

\n

FESM - 扁平 ES 模块的缩写，由一种文件格式组成，该文件格式是通过将从入口点访问的所有 ES 模块扁平化为单个 ES 模块而创建的。

\n

\n

该规范似乎在这个谷歌文档中：

\n

https://docs.google.com/document/d/1CZC2rcpxffTDfRDs6p1cfbmKNLA6x5O-NtkJglDaBVs

\n

更多信息：

\n

\n

我们强烈建议您在将构建工件发布到 npm 之前\n通过扁平化 ES 模块来优化构建工件。\n这会显着缩短 Angular 应用程序的构建时间以及\n最终应用程序包的下载和解析时间。\n请查看诺兰·劳森 (Nolan Lawson) 撰写的优秀文章“小模块的成本”。

\n

Angular 编译器支持生成索引 ES 模块文件，\n然后可以使用 Rollup 等工具来扁平化模块，\n从而产生我们称为扁平化 ES 模块或 FESM 的文件格式。

\n

FESM 是一种文件格式，通过将从入口点可访问的所有 ES 模块扁平化为单个 ES 模块而创建。它是通过跟踪包中的所有导入并将该代码复制到单个文件中而形成的，同时保留所有公共 ES 导出并删除所有私有导入。

\n

缩写名称 \xe2\x80\x9cFESM\xe2\x80\x9d（发音为 \xe2\x80\x9cphesom\xe2\x80\x9d）后面可以有一个数字\n，例如 \xe2\x80\x9cFESM5\xe2\x80\ x9d 或 \xe2\x80\x9cFESM2015\xe2\x80\x9d。该数字指\n模块内 JavaScript 的语言级别。因此，FESM5 文件\n将是 ESM+ES5（导入/导出语句和 ES5 源代码）。

\n

要生成扁平 ES 模块索引文件，请在 tsconfig.json 文件中使用以下\n配置选项：

\n

\n

{   "compilerOptions": {\n     ...\n     "module": "es2015",\n     "target": "es2015",\n     ...   },   "angularCompilerOptions": {\n     ...\n     "flatModuleOutFile": "my-ui-lib.js",\n     "flatModuleId": "my-ui-lib"   } }\n

\n

\n

一旦 ngc 生成了索引文件（例如 my-ui-lib.js），捆绑器和 Rollup 等优化器就可以用来生成扁平化的 ESM 文件。

\n

\n