什么是 fesm2015 以及它与 esm2015 的关系?
What is fesm2015 and how it relates to esm2015?
我知道 esm2015 指的是 ecmascript 2015 specification (modules section)
描述的 ecmascript 模块
我看到在 node_modules/
下的一些库中,在目录 esm2015/
旁边,另一个名为 fesm2015/
.
- 什么是fesm2015?
- 是否扩展 esm2015?
- 是否有任何规范描述它?
它是 Angular 包格式的一部分。
FESM - short for Flattened ES Modules and consists of a file format
created by flattening all ES Modules accessible from an entry point
into a single ES Module.
规范似乎在此 google 文档中:
https://docs.google.com/document/d/1CZC2rcpxffTDfRDs6p1cfbmKNLA6x5O-NtkJglDaBVs
更多信息:
We strongly recommend that you optimize the build artifacts before
publishing your build artifacts to npm, by flattening the ES Modules.
This significantly reduces the build time of Angular applications as
well as download and parse time of the final application bundle.
Please check out the excellent post "The cost of small modules" by
Nolan Lawson.
Angular compiler has support for generating index ES module files that
can then be used to flattened module using tools like Rollup,
resulting in a file format we call Flattened ES Module or FESM.
FESM is a file format created by flattening all ES Modules accessible
from an entry point into a single ES Module. It’s formed by following
all imports from a package and copying that code into a single file
while preserving all public ES exports and removing all private
imports.
The shortened name “FESM” (pronounced “phesom”) can have a number
after it such as “FESM5” or “FESM2015”. The number refers to the
language level of the JavaScript inside the module. So a FESM5 file
would be ESM+ES5 (import/export statements and ES5 source code).
To generate a flattened ES Module index file, use the following
configuration options in your tsconfig.json file:
{ "compilerOptions": {
...
"module": "es2015",
"target": "es2015",
... }, "angularCompilerOptions": {
...
"flatModuleOutFile": "my-ui-lib.js",
"flatModuleId": "my-ui-lib" } }
Once the index file (e.g. my-ui-lib.js) is generated by ngc, bundlers
and optimizers like Rollup can be used to produce the flattened ESM
file.
我知道 esm2015 指的是 ecmascript 2015 specification (modules section)
描述的 ecmascript 模块我看到在 node_modules/
下的一些库中,在目录 esm2015/
旁边,另一个名为 fesm2015/
.
- 什么是fesm2015?
- 是否扩展 esm2015?
- 是否有任何规范描述它?
它是 Angular 包格式的一部分。
FESM - short for Flattened ES Modules and consists of a file format created by flattening all ES Modules accessible from an entry point into a single ES Module.
规范似乎在此 google 文档中:
https://docs.google.com/document/d/1CZC2rcpxffTDfRDs6p1cfbmKNLA6x5O-NtkJglDaBVs
更多信息:
We strongly recommend that you optimize the build artifacts before publishing your build artifacts to npm, by flattening the ES Modules. This significantly reduces the build time of Angular applications as well as download and parse time of the final application bundle. Please check out the excellent post "The cost of small modules" by Nolan Lawson.
Angular compiler has support for generating index ES module files that can then be used to flattened module using tools like Rollup, resulting in a file format we call Flattened ES Module or FESM.
FESM is a file format created by flattening all ES Modules accessible from an entry point into a single ES Module. It’s formed by following all imports from a package and copying that code into a single file while preserving all public ES exports and removing all private imports.
The shortened name “FESM” (pronounced “phesom”) can have a number after it such as “FESM5” or “FESM2015”. The number refers to the language level of the JavaScript inside the module. So a FESM5 file would be ESM+ES5 (import/export statements and ES5 source code).
To generate a flattened ES Module index file, use the following configuration options in your tsconfig.json file:
{ "compilerOptions": {
...
"module": "es2015",
"target": "es2015",
... }, "angularCompilerOptions": {
...
"flatModuleOutFile": "my-ui-lib.js",
"flatModuleId": "my-ui-lib" } }
Once the index file (e.g. my-ui-lib.js) is generated by ngc, bundlers and optimizers like Rollup can be used to produce the flattened ESM file.