Babel-JavaScript编译器

作用：

在当前或旧的浏览器中，把ES6+语法向后兼容，它是一个工具链。可以单独使用

npm install @babel/core @babel/cli -D // 安装好babel去编译js文件
npx babel src --out-dir build // babel 去编译src下的所有js文件 到 build目录 
// 结果是 输出的js跟原来的js是一样的，看来babel编译js也是需要插件的

npm install @babel/plugin-transform-arrow-functions -D // 箭头函数的转换插件
npm install @babel/plugin-transform-block-scoping -D // 块作用域的转换插件var
npx babel src --out-dir build --plugins=@babel/plugin-transform-arrow-functions,@babel/plugin-transform-block-scoping // 能看到被编译了
// 但是还有其他的语法需要插件，要这样一个个引用嘛，，， =》 preset就出现了！！

npm install @babel/preset-env -D // 安装babel的根据环境(.browserslistrc)预设
npx babel src --out-dir build --presets=@babel/preset-env // 果然文件都被编译了!

1.Babel编译器跟webpack结合使用

npm install webpack webpack-cli

创建webpack.config.js文件
const path