Angular ng build with minimum number of files ? (supporting only Chrome is also fine)

Question

When I build my angular project i see

main-es5.js and main-es2015.js both files. I just want to support only Chrome browser how can I turn off building the old js files I want minimum number of files on Build.

My Build also runs twice since I upgraded to 8

Note

Build time has significantly increased and i get the warning WARNING in budgets, maximum exceeded for initial.

This is my Angular.json File

      "optimization": true,
      "outputHashing": "none",
      "sourceMap": true,
      "extractCss": false,
      "namedChunks": false,
      "showCircularDependencies": false,
      "aot": true,
      "extractLicenses": false,
      "statsJson": false,
      "progress": true,
      "vendorChunk": false,
      "buildOptimizer": true,

browserlist file

# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
# For additional information regarding the format and rule options, please see:
# https://github.com/browserslist/browserslist#queries

# You can see what browsers were selected by your queries by running:
#   npx browserslist

> 0.5%
last 2 versions
Firefox ESR
not dead
not IE 9-11 # For IE 9-11 support, remove 'not'.

Edit: Raised feature request on Github

This depends on browserslist. It's all explained in the documentation: https://angular.io/guide/deployment#differential-loading — JB Nizet, Jun 05 '19 at 16:24
Define "Modern Browsers"? Do you want it to compile to ES6 instead of ES5? — Narm, Jun 05 '19 at 16:25
edited my question, how can I get a minimum build for only Chrome latest versions, basically i want least amount of files on build. — dota2pro, Jun 05 '19 at 16:29

dota2pro · Accepted Answer · 2019-11-05T15:16:12.943

6

As per @clydin 's comment on GitHub

**browserlist** 
last 2 Chrome versions

https://browserl.ist/?q=last+2+Chrome+versions

Creates a minimal chrome only ES2015+ build

edited Nov 05 '19 at 15:16

answered Jun 05 '19 at 18:11

dota2pro

7,220
7
44
79

score 3 · Answer 2 · answered Jun 05 '19 at 16:42

3

Inside tsconfig.json there is target : "es2015" change target to "es5" you will get build like angular 7 application.

answered Jun 05 '19 at 16:42

Ankush Jane

146
1
1
7

what is the difference between `es5` and `es2015` – dota2pro Jun 05 '19 at 16:47
Thanks but If i change to `es5` doesn't that mean to support for old browsers ? – dota2pro Jun 05 '19 at 17:30
Yes, you are correct it will not support old(legacy) browsers. – Ankush Jane Jun 05 '19 at 17:35
But it's all depends on your code as well.. if you use flex then it will not support below IE 10 etc. – Ankush Jane Jun 05 '19 at 17:38
1

No, that's not what i meant, See https://stackoverflow.com/a/42429053/5724889 es5 will just covert to old code – dota2pro Jun 05 '19 at 17:46

Angular ng build with minimum number of files ? (supporting only Chrome is also fine)

2 Answers2