babel-preset-es2015，babel-polyfill 与 babel-plugin-transform-runtime

Posted 2020-10-20 大泽队长

babel-preset-es2015 是一个babel的插件，用于将部分ES6 语法转换为ES5 语法。转换的语法包括：

1. 箭头函数
2. class语法
3. const和let
4. 对象属性名表达式：

   let a = {
      [‘a‘+‘b‘]: 1
   }

5. 对象属性名缩写

   var o = { a, b, c };
   
   var cat = {
     getName() {
        return name;
     }
   };

6. 函数参数的三个新语法：【默认参数 、解构参数 、剩余参数 】
7. 解构赋值
8. 字符串模板
9. for-of
10. ES2015 modules 转换为 CommonJS
11. generator语法转换
12. 正则表达式u修饰符 等

但是babel-preset-es2015并不会转换promise、generator等函数，我们还要引入babel-polify库。

使用babel-polify时，需要在你的业务代码中，在使用ES6的新函数 前通过<script> 或require 等 引入 babel-polyfill（就像引入jquery一样），她会把promise等函数添加到全局对象上；

而babel-plugin-transform-runtime 插件的作用，简单来说，就是优化babel-preset-es2015，babel-polyfill的使用：

1. 提取了 转换ES6 语法时的公共代码，减少了转换后的重复代码；
2. 可使编译完成的代码的全局对象不被babel-polyfill 污染

（个人理解）