我应该如何在 Angular 中使用 ES2020？

Question

这是我的 tsconfig.json 文件：

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "module": "es2015",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "importHelpers": true,
    "target": "es6",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2018",
      "dom"
    ]
  }
}

当我将 lib 和目标版本更改为 es2020 时，出现以下错误：

tsconfig.json(13,15): error TS6046: Argument for '--target' option must be: 'es3', 'es5', 'es6', 'es2015', 'es2016', 'es2017', 'es2018', 'esnext'.

Answer 1

我认为 es2020 直到 Angular 9 才被添加为目标。因此，如果您使用的版本低于该版本，我认为它无法正常工作。

esnext 以最新支持的功能为目标，因此它们的工作方式应该非常相似。

Answer 2

es2020 支持是 introduced in TypeScript 3.8。

您必须升级到 Angular 9.1（或更高版本）才能使用 TypeScript 3.8。

Answer 3

我正在使用 Angular 的 11.2.14 版本，但仍然无法在 tsconfig.json 中使用 "target": "ES2020"。

我的构建失败于：

Error: ./src/app/shared/validators/form.validators.ts 10:21 Module parse failed: Unexpected token (10:21) File was processed with these loaders:

./node_modules/@angular-devkit/build-optimizer/src/build-optimizer/webpack-loader.js

./node_modules/@ngtools/webpack/src/index.js

You may need an additional loader to handle the result of these loaders. ...

根据这个GitHub issue，错误与WebPack（我的版本4.44.2）有关。 WebPack 5 将支持 ES2020。

我应该如何在 Angular 中使用 ES2020？

How should i use ES2020 in Angular?

angular

typescript

ecmascript-next

ecmascript-2020