Why does Angular build create files with 'es5' and 'es2015' but not 'es6' (or no suffix at all)?

前端 未结 3 1329
花落未央
花落未央 2021-02-19 05:43

I recently downloaded the Angular CLI (@angular/cli 9.0.1). I then proceeded to create a new application so that I could create a new Angular Element, package it up

相关标签:
3条回答
  • 2021-02-19 06:24

    They are the same thing.

    6th Edition - ECMAScript 2015

    • 6th Edition ECMAScript -> ES6
    • ECMAScript 2015 -> ES2015

    Different names for the same thing. Angular has simply chosen to call it es2015.

    0 讨论(0)
  • 2021-02-19 06:39

    ES2015 is the same as ES6. ECMAScript 6 was released in 2015.

    Some history:

    https://codeburst.io/javascript-wtf-is-es6-es8-es-2017-ecmascript-dca859e4821c

    0 讨论(0)
  • 2021-02-19 06:43

    Angular doesn't bundle the JavaScript files into a single file.

    You can add a build step to concat the files together.

    concat-build.js:

    var concat = require('concat');
    const es5 = ['./dist/app/runtime-es5.js','./dist/app/polyfills-es5.js','./dist/app/main-es5.js'];
    const es2015= ['./dist/app/runtime-es2015.js','./dist/app/polyfills-es2015.js','./dist/app/main-es2015.js'];
    concat(es5, './dist/app/elements-es5.js');
    concat(es2015, './dist/app/elements-es2015.js');
    

    package.json:

    "scripts": {
       "concat": "./concat-builds.js",
       "build": "ng build --prod --output-hashing=none && npm run concat"
    }
    

    Don't get confused by the ES5 and ES2015 builds, because the Angular team split the bundles depending upon how modules are loaded (not specifically on the JavaScript version).

    Web browsers that support modules will load the ES2015 versions instead of the ES5 versions, but both are recommended to be in the Html.

    If you want only a single file to use, then you're forced to use the older ES5 version, and should provide it as follows:

    <script src="elements-es5.js">
    

    It is recommended to provide both files as follows and the browser will load the appropriate version:

    <script src="elements-es5.js" nomodule defer>
    <script src="elements-es2015.js" type="module">
    

    Please note:

    Older browsers will ignore the type="module" version, and newer browsers will skip the nomodule version.

    0 讨论(0)
提交回复
热议问题