bable 是一個工具鏈,主要用于將 ECMAScript 2015+ 版本的代碼轉換為向后兼容的 JavaScript 語法,以便能夠運行在當前和舊版本的瀏覽器或其他環境中。
bable配置比webpack簡單很多,webpack里面的`bable-loader`就是用來調用babel的。
bable的配置文件叫做`.bablerc`。babel主要有`env`配置和`plugins`配置。
env配置主要配置各種presets,plugins配置主要配置插件。
*****
### env:
以下為bable 7的env:

以下為bable 6的env:

其中stage-x表示ES提案到什么階段,最新的bable不支持stage-x的env,轉而使用`plugin-proposal-x`.
[https://segmentfault.com/a/1190000016541105](https://segmentfault.com/a/1190000016541105)
[https://www.vanadis.cn/2017/03/18/babel-stage-x/](https://www.vanadis.cn/2017/03/18/babel-stage-x/)
真實配置文件如下:
```js
{
"comments": false,
"env": {
"test": {
"presets": [
["env", {
"targets": { "node": 7 }
}],
"stage-0"
],
"plugins": ["istanbul"]
},
"main": {
"presets": [
["env", {
"targets": { "node": 7 }
}],
"stage-0"
]
},
"renderer": {
"presets": [
["env", {
"modules": false
}],
"stage-0"
]
},
"web": {
"presets": [
["env", {
"modules": false
}],
"stage-0"
]
}
},
"plugins": ["transform-runtime"]
}
```
其中,env的test, main, web等,是環境變量,可以再webpack中設置:
```js
process.env.BABEL_ENV = 'main'
```
加上配置參數"target",它表示我們需要支持哪些平臺+哪些版本。這里聲明我們要支持的是node版本為7.x.x。
#### targets: { \[string\]: number },默認{}
需要支持的環境,可選例如:chrome, edge, firefox, safari, ie, ios, node,甚至可以制定版本,如node: 6.5。也使用node: current代表使用當前的版本。
#### browsers: Array\\| string,默認\[\]
瀏覽器列表,使用的是[browserslist](https://github.com/ai/browserslist),可選例如:last 2 versions, > 5%。
#### loose: boolean,默認false
是否使用寬松模式,如果設置為true,plugins里的插件如果允許,都會采用寬松模式。
#### debug: boolean,默認false
編譯是否會去掉console.log。
#### whitelist: Array\\,默認\[\]
設置一直引入的plugins列表。
*****
### plugins
`babel-ployfill`
`transform-runtime`