Babel

---

一、babel是什么？

• babel是一个工具链，主要用于旧浏览器或者环境中将ECMAScript2015+代码转换为向后兼容版本的JavaScript
• 包括：语法转换，源码转换等

[1,2,3].map(n)=> n + 1;
//转换后
[1,2,3].map(function(n){
	return n + 1
})

二、Babel底层原理

1.Babel是如何将我们的一段代码（ES6、Typescript，React）转成另外一段代码（es5）的呢？

• 从一种源代码（原生语言）转换成另一种源代码（目标语言）这时什么工作呢？

• 就是编译器，事实上我们可以将Babel看成就是一个编译器

• Babel编译器的作用就是将我们的源代码，转换成浏览器可以直接识别的另外一段源代码
  Babel也拥有编译器的工作流程：

• 解析阶段（Paesing）

• 转换阶段（Transformation）

• 生成阶段（Code Generation）

https://github.com/jamiebuilds/the-super-tiny-compiler

三、Babel编译器执行原理

Babel执行阶段：

配置Babel

{
test:/\.js$/,
use:{
	loader:"babel-loader",
	options:{
	plugin:[
	"@babel/plugin-transform-orrow-function",
	"@babel/plugin-transform-block-scoping",
],
	// 预设,就不用配置上面的了
	presets:[
	"@babel/preset-env"
			]
		}
	}
}