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

【问题标题】：How should i use ES2020 in Angular?我应该如何在 Angular 中使用 ES2020？
【发布时间】：2026-01-08 08:05:02
【问题描述】：

这是我的 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)：错误 TS6046：“--target”选项的参数必须是：“es3”、“es5”、“es6”、“es2015”、“es2016”、“es2017”、 'es2018'，'esnext'。

【问题讨论】：

我的回答解决了你的问题吗？
是的。感谢您的帮助
没问题，很高兴能帮上忙 :)

标签： angular typescript ecmascript-next ecmascript-2020

【解决方案1】：

es2020 支持是introduced in TypeScript 3.8。

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

【讨论】：

【解决方案2】：

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

esnext 以最新支持的功能为目标，因此应该非常相似。

【讨论】：

【解决方案3】：

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

我的构建失败了：

错误：./src/app/shared/validators/form.validators.ts 10:21 模块解析失败：意外令牌 (10:21) 使用这些加载器处理了文件：

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

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

您可能需要额外的加载器来处理这些加载器的结果。 ...

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

【讨论】：