Angular cli 15 and browserslist are targeting the incorrect ECMAScript version

Question

I'm attempting to build an Angular 15 app using Angular CLI targeting ES6 (we need to support Chrome version 79).

The .browserslistrc file is as follows

> 0.5%
last 2 versions
Firefox ESR
Chrome >= 79
not dead
not IE 9-11
not kaios 2.5
not op_mini all

Yet the output .js files of the build use the null coalescing operator (??) which was added in ES2020 so it is not targeting ES6 as it should be. I get no warnings in the build that ES6 is not supported, which I do get if I attempt to target ES5.

Answer 1

Browserlist does not determine what ES version your Typescript is compiled to. This is governed by the target ES version in your tsconfig.

// .browserlistrc:
> 0.5%
last 2 versions
Firefox ESR
Chrome >= 79
not dead
not IE 9-11
not kaios 2.5
not op_mini all

// .ts
console.log(null ?? 2);

// .js
console.log(null ?? 2); // tsconfig target >= es2020
console.log(false ? 0 : 2); // tsconfig target = es2019

Browserlist is for providing compatibility such as identifying applicable polyfills and build time targeting for other packages.

What is the significance of browserslist in package.json created by create-react-app

---

"I get no warnings in the build that ES6 is not supported, which I do get if I attempt to target ES5."

Angular 15 does not support ES5 any more which is why you get warnings. Support for that died with Angular 13 along with support for IE11.

https://blog.angular.io/angular-v13-is-now-available-cce66f7bc296