Angular app: es2020 migration from es2015

Question

I have just updated my app to Angular 12 and am trying to use es2020. For some reason I am still getting errors when my app builds because it seems the app is still trying to use es2015:

node_modules/typescript/lib/lib.es2015.promise.d.ts:33:34
[ng]     33     new <T>(executor: (resolve: (value: T | PromiseLike<T>) => void, reject: (reason?: any) => void) => void): Promise<T>;
[ng]                                         ~~~~~~~~~~~~~~~~~~~~~~~~~
[ng]     An argument for 'value' was not provided.

I've updated tsconfig.json to reflect es2020:

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "inlineSources": true,
    "declaration": false,
    "sourceRoot": "/",
    "module": "es2020",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "importHelpers": true,
    "target": "es2020",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2020",
      "dom"
    ]
  },
  "exclude": [
    "node_modules",
    "**.*.spec.ts",
    "plugins/**"
  ]
}

EDIT:

When I serve my app I also see the following:

[ng] Compiling @angular/core : es2015 as esm2015
[ng] Compiling @ionic-native/core : module as esm5
[ng] Compiling @angular/common : es2015 as esm2015
[ng] Compiling @angular/cdk/collections : es2015 as esm2015
[ng] Compiling @ionic-native/splash-screen : module as esm5
[ng] Compiling @ionic-native/barcode-scanner : module as esm5
[ng] Compiling @ionic-native/status-bar : module as esm5
[ng] Compiling @angular/platform-browser : es2015 as esm2015
[ng] Compiling @angular/cdk/platform : es2015 as esm2015

Lastly, I am already using Typescript 4.3.5 in my package.json.

But I have not explicitly installed any new typings since making the change. What do I do next to allow the change to es2020?

Update your typescript version. That might help you resolve the issue — Sanjay Achar, Jan 25 '22 at 11:34
@SanjayAchar I also deleted node_modules and reinstalled. Any other ideas? — Jeremy Thomas, Jan 25 '22 at 13:25
As per your terminal log, the code is being complied to `es2015` because most browsers support this. Can you check if you are able to use any es2020 syntax — Sanjay Achar, Jan 26 '22 at 11:02

Simon_Weaver · Answer 1 · 2023-02-22T02:40:06.087

Remember when you target ES2020 you exclude any users with iOS 13.3 and below (most likely if you're using ?? or ?.). While that version is 2+ years old it's important to check your server logs to see how many users / customers are still using (and maybe bringing revenue) with old browsers.

Unfortunately since Safari is tied to the iOS version if someone doesn't update iOS they fall behind with Safari and ES versions too (and yes this applies even for people using Chrome / Firefox on iOS).

The point is to make sure you really want to do this before doing it.

Personally I created ts.config.ES2020.app and ts.config.ES2015.app files for both and I use configuration profiles in angular.json to choose 2020 during development.

That means I'll see modern things like ?? in my development browser but that $85 we got from Safari 13.3 users the first half of this year will hopefully double!

Angular app: es2020 migration from es2015

1 Answers1