webpack之前一知半解，这次有空就把最新的webpack4好好学习一下(2019-05-29 因为webpack的很多东西版本都在升级，网上博客很多都是老版本的，所以加个时间方便大家决定是否有必要阅读)
presets预设
预设是一组插件的集合，插件才是让babel解析之后转换的关键，插件是从前到后，而预设是从后到前执行，插件在 Presets 前运行。
常见的预设有以下几个：
- @babel/preset-env
@babel/preset-env是babel v7新版的，旧版的叫babel-preset-env，按照es年代分有什么babel-preset-es2015（就是转换es6版本的），@babel/preset-es2016之类的，如果一个一个导入到你的项目会很麻烦，新的es出来了你还得加，现在@babel/preset-env就是所有的es集合，有了它，babel-preset-es2015，@babel/preset-es2016都不需要加了（除非你就有什么特定配置）。
"presets": [
[
"@babel/preset-env",
{
"targets": {
"browsers": ["last 2 versions"]
},
"modules": false,
"useBuiltIns": "usage",
"corejs": 3
}
]
]
targets是指转换哪些浏览器，如果没有什么特别的需求，选择默认的就好了
modules 有这些选择"amd" | "umd" | "systemjs" | "commonjs" | "cjs" | "auto" | false, defaults to "auto" 是用来将将es6的模块化语法转换为哪种语法，现在有webpack来做了，这个可以选择false了
useBuiltIns 现在是重点了，选择如下 "usage" | "entry" | false, defaults to false
false就不用解释了，就是不使用这个功能呗。
介绍另外2个我们先看看@babel/polyfill这个东东，它基本包含了所有的babel的功能，使用的方法也很简单，直接在主js上面import "@babel/polyfill";就可以了，缺点也很明显
1 它把所有的功能都导入你的项目里去了，自然会导致你的项目打包过大，如果你不在意自然直接使用最简单，用最少的配置。（usage" | "entry就是用来优化这个的）
2 它会在全局加入一些方法如promise，会导致全局污染
entry选项是这样子的，根据你选择的浏览器环境来决定@babel/polyfill有哪些是需要加入你项目的，如果你的指定的浏览器支持一些语法，就没必要再导入一遍了
usage则是根据你的代码中用到了哪些（直接通过名字来决定）新方法，就从@babel/polyfill加入到你的项目，该方法目前还是实验性的。
corejs 官网的文档配置里目前没有这个，但是“useBuiltIns": "usage"后会提示安装core-js，版本如果为3就要指定版本，并且在主文件以前是import "babel-polyfill";，改为import "core-js/stable"; import "regenerator-runtime/runtime";
- @babel/preset-stage-0 @babel/preset-stage-1 ...
这些其实已经被废弃了，不过挺经典的值得了解一下，stage-0是指标准，目前还没有纳入es的一些功能，装饰器就是其中之一
stage0 (https://babeljs.io/docs/en/babel-preset-stage-0) 只是一个美好激进的想法，一些 Babel 插件实现了对这些特性的支持 ，但是不确定是否会被定为标准.
stage1 (https://babeljs.io/docs/en/babel-preset-stage-1) 值得被纳入标准的特性.
stage2 (https://babeljs.io/docs/en/babel-preset-stage-2) 该特性规范己经被起草，将会被纳入标准里.
stage3 (https://babeljs.io/docs/en/babel-preset-stage-3) 该特性规范已经定稿，大浏览器厂商和 Node.js 社区己开始着手实现.
stage0包含了它下面的，stage1也包含了它下面的的，依次包含。
但是官网说他们被废弃了，具体原因大概是因为太好用了，以至于大家都是stage0就开始用了，但是却不知道stage0到底包括什么，如果规范有了变化，你都不知道到底发生了什么，于是乎babel决定
你想用一些es还没有出来的功能，你要用插件的方式安装具体你需要的而不是一个stage0了事，文档如下
https://github.com/babel/babel/blob/master/packages/babel-preset-stage-0/README.md
@babel/plugin-transform-runtime 和 @babel/runtime
这2个就是用来解决@babel/polyfill的第二个问题，污染环境变量的问题，其实官网上说了，污染的问题只有可能是你的项目作为库使用才会存在，普通的应用程序，直接使用polyfill是没有问题
@babel/runtime是运行时，而@babel/plugin-transform-runtime是插件安在dev上的，
"plugins": [
["@babel/transform-runtime", {
"corejs": 3,
"helpers": true,
"regenerator": true,
"useESModules": false
}]
]
这2个只能用来解决全局变量问题，原型的实例方法没办法加，还是要用到polifill