babel

preset-env 是ES语法插件的合集，官方已经不在推荐preset-201x之类的包，该包可以通过配置自动兼容代码，包括自动引入polyfill垫片处理新的API(例如：Promise、Generate、Symbol等)以及实例方法(例如 Array.prototype.includees)

1. 在根目录下创建.babellrc配置文件

{
“presets”: [
[ “@babel/preset-env”, {
“targets”: {},
“useBuiltIns”: false,
“corejs”: false
}]
]
}
targets: 针对项目指定生成适应环境的代码。如果不进行配置，babel会转义所有ES6+进行环境适配，十分不推荐该用法。
useBuiltIns：该选项用来配合@babel/polyfill进行使用，针对Babel > 7.4.0, 官方不再推荐使用该库，请选择core-js，根据安装core-js版本在corejs选项填写数字2或3。
useBuiltIns(三个选项)：false | “entry”| “usage”
false(默认值): 此时corejs属性无效, 不引入垫片，根据target属性转换后转换相应的语法
“entry”: 在入口处手动引入垫片
“usage”: 自动检测文件中需要使用垫片的地方并自动引入对应的垫片(官方推荐)
core: 2 | 3
corejs 属性仅仅在useBuiltIns 设置为false时有效
corejs设置不同参数的时候注意安装对应的包。如果useBuiltIns为“entry”的时候还需要手动在入口引入
corejs选项需要安装的包 2 | 3 现在通过npm i core-js -S 安装的时候如果不指定版本，已经默认安装3了
ES+中不仅包含新增的语法（如箭头函数、类），还有一些实例的扩展（Array.prototype.includes等），以及很多内置函数（如Promise、Symbol）。然而preset-env在不引入polyfill时，对于处理这些应用场景是无能为力的。而为了解决这样的问题，我们通常有两种方法：使用 Polyfill 或 Babel-runtime 进行功能填充。接下来我们会举例说明两者的优缺点以及应用场景。

上面我们通过 import “@bable/polyfill” 的方式来实现针对api层面的“抹平”。然而从 babel v7.4.0开始官方就不建议采取这样的方式了。 因为引入 @bable/polyfill 就相当于在代码中引入下面两个库
import “core-js/stable”;
import “regenerator-runtime/runtime”;
这意味着不仅不能按需加载还有全局空间被污染的问题。因为他是通过向全局对象和内置对象的prototype上添加方法来实现的。
@babel/plugin-transform-runtime
当使用了plugin-transform-runtime插件后，就可以将babel转译时添加到文件中的内联辅助函数统一隔离到babel-runtime提供的helper模块中，编译时，直接从helper模块加载，不在每个文件中重复的定义辅助函数，从而减少包的尺寸
useBuiltIns: “usage”, // 实现按需加载
vue-cli配置参考
https://cli.vuejs.org/guide/browser-compatibility.html