user image

Shilpa
Published in : 2022-03-01

Angular 10: Is it possible to run and build Angular 10 project with only es2015 (Any One of this)?

Angular

I am using Angular CLI v10.2.4, My build process is taking around 15-20 minutes for each production builds because it builds es5 and es2015 version both. Is it possible to build a project with only es2015 / es2016 / es2017? (Any one of them?)

I changed my tsconfig file as below, but didn't see a working solution yet!

{ "extends": "../tsconfig.json", "compilerOptions": { "outDir": "../out-tsc/app", "baseUrl": "", "module": "es2015", //<------------------------------ es2015 "types": [ "node" ],"typeRoots": [ "../node_modules/@types" ] }, "exclude": [ "test.ts", "**/*.spec.ts" ]}

Any help will be appreciated.

 

 

Comments

Rakshit Date : 2022-03-02

Best answers

34

Best answers

34

Yes, it is possible. 

#Approach 1: If you want to use package.json file to maintain your browser support, add the following code.

 "browserslist": [ "defaults", "not IE 11", "maintained node versions" ]

#Approach 2:  Add `.browserslistrc` file to your root directory of your angular project and add your browser supports in that file.

# Browsers that we supportdefaultsnot IE 11maintained node versions

If you want to build your production build release only capable of ES2015 for particular browsers, only one build should be created.

"browserslist": [ "> 5%"]

Note: only chrome makes it into the list with >5%

If you don't want firefox, IE and edge browsers, You can use following browserslist array entries. Put the word not at the begin of every line which browser support you don't want.

defaultsnot > 0.5%not last 2 versionsnot Firefox ESRnot deadnot IE 9-11 # For IE 9-11 support, remove 'not'.

This will fix your double prod build time and so I saved you a lot of time!

References: Browsers List

Leave a comment

Join us

Join our community and get the chance to solve your code issues & share your opinion with us

Sign up Now

Related posts

How to reload Angular component without refreshing page?
Publish date: 2022-03-02 | Comments: 1

Tag: Angular

Angular - PrimeNG charts adding colors for each legends dynamically
Publish date: 2022-02-27 | Comments: 1

Tag: Angular

How to call event handler onload for Angular application?
Publish date: 2022-03-02 | Comments: 2

Tag: Angular

Angular: HTML anchor tag with #idref issue
Publish date: 2022-03-01 | Comments: 2

Tag: Angular