Angualr 9 - ng build --prod created multiple es5 and es2015 js files

Question

When I try to build my angular app I get the below as the bundle along with the main and other required files

0-es5.js
0-es2015.js
1-es5.js
1-es2015.js
4-es5.js
4-es2015.js
9-es5.js
9-es2015.js
10-es5.js
10-es2015.js
11-es5.js
11-es2015.js
12-es5.js
12-es2015.js
13-es5.js
13-es2015.js

tsconfig.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "module": "esnext",
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2018",
      "dom"
    ],
    "resolveJsonModule": true,
    "esModuleInterop": true
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  }
}

Any idea why am getting multiple es5 and es2015 files?

Answer 1

Since Angular 8, you get ES2015 and ES5 differentiated builds for production. Depending on the environment on which the app is loaded (ie the browser) one of them gets loaded - but not both.

This feature is aimed at providing better compatibility with older versions of browsers that don't have good support for ES2015, like the case of Inte.net Explorer or the first Edge versions.

In order to disable this feature, you can read this related SO question: how to turn off differential loading in Angular v8?