how to turn off differential loading in Angular v8

Question

Angular-CLI v8 implemented differential loading. But I don't need files built by es5. I want to decrease deploy quantity.

I tried below. But CLI has generated es5 files.

• set es5browsersupport: false in angular.json, and got error.
• exclude Chrome 41, IE 9-11 and ie_mob 11 from browserList.

Answer 1

None of these answers worked for me on @angular/cli 8.3.8. Using the npx browserslist I could see that there were more browsers in the list than these StackOverflow answers were up-to-date for.

To keep it simple and ensure differential loading doesn't try to build for es5, you can set your browserslist to use just 1 older (but still es6/es2015 compliant) browser version

# we only want es2015 compliant browsers https://caniuse.com/#feat=es6
# just use one as representative for all
Chrome >= 61 

Answer 2

In Angular 8 the file browserlist have to be in project root folder. Following entries were needed on my project to disable differential loading:

> 0.5%
last 2 versions
Firefox ESR
not dead
not IE 9-11
not samsung 4
not android 4.4.3-4.4.4
not last 2 ie_mob versions
not last 2 op_mini versions
not last 2 op_mob versions
not last 2 baidu versions
not last 2 kaios versions
not last 2 and_uc versions
not last 2 and_qq versions
not last 2 edge versions
not chrome 49

Answer 3

Can add below env variables to disable differential loading features. The below works for Windows

"build:prod": "set NG_BUILD_DIFFERENTIAL_FULL=true && ng build --prod",

For Mac

"build:prod": "NG_BUILD_DIFFERENTIAL_FULL=true; ng build --prod",

Answer 4

I succeeded to build without es5 files in Angular v8-rc4.

set like below in browserList to make isEs5SupportNeeded false in build-angular.

> 0.5%
last 2 versions
Firefox ESR
not dead
not samsung 4
not android 4.4.3-4.4.4
not last 2 IE versions
not last 2 ie_mob versions
not last 2 op_mini versions
not last 2 op_mob versions
not last 2 baidu versions
not last 2 kaios versions
not last 2 and_uc versions
not last 2 and_qq versions
not last 2 edge versions

refer to this list. https://caniuse.com/#feat=es6-module

Answer 5

At the moment many people have es5 bundle generated because @angular/cli does not consider latest Edge (i.e., Edge 18) to be es2015-modules compliant: https://github.com/angular/angular-cli/issues/14580.

A dirty fix is to exclude Edge from the list of browsers you support (in the browserslist file). This problem should be fixed if you upgrade to @angular/cli 8.1.0.

Answer 6

I was able to solve for my project using Angular 8.1.1 by adding the "browserslist" key in package.json. (Placed at top level, same as "name", "dependencies", etc.)

 "browserslist": [
    "last 2 Chrome versions"
  ]

This case works in specific cases where you only need the app to work in Chrome. If you need more browser compatibility check out other options in the implementation docs here: https://www.npmjs.com/package/browserslist