Angular typescript error with BigInt and Optional Chaining, nullish coalescing

Question

We have an application that needs to be supported in old Chrome (v79).

Angular Version 13.2.7 Typescript Version 4.5.5 Node Version 16.14.0

We are getting an error:

ERROR: Big integer literals are not available in the configured target environment

When we set target as 2017 (anything less than 2020) & optimization is enabled for the build. BigInt are part of es2020 specification & I could not find a polyfill that works.

When we set target as es2020, error with BigInt is resolved, angular build is successful but application fails to open in Chrome 79 due to error Unrecognized character. This is happening as for es2020 optional chaining (?.) & nullish coalescing is not transpiled by typescript as these operators are natively supported in es2020 target. So we can neither stay on es2017 nor jump to es2020. I looked into using Babel transpilation with Angular, WebPack but nothing worked. Is anyone able to fix this issue?

Answer 1

You can prevent the error by adding es2020.bigint to the lib array in your tsconfig.json:

{
  "target": "es2017",
  "lib": ["es2017", "dom", "es2020.bigint"]
}

This should target ES2017, and additionally include the types just for bigint.