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 support

defaults
not IE 11
maintained 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.

defaults
not > 0.5%
not last 2 versions
not Firefox ESR
not dead
not 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

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

Tag: Angular

Import Swiper into Angular causes error
Publish date: 2022-03-05 | Comments: 1

Tag: Angular

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

Tag: Angular

How to bind Weekends off to my kendo calendar in Angular?
Publish date: 2022-03-11 | Comments: 2

Tag: Angular

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

Tag: Angular

Adding country flags is really struggling thing?
Publish date: 2022-02-25 | Comments: 6

Tag: Angular

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

Tag: Angular