webpack中babel的使用

什么是babel？
babel是一种将es6语法转换为浏览器能解析的es5语法的一种工具，它的功能非常强大，具体使用方法及配置方法可在babel官网查询，下面就babel在webpack中的使用作简要概述：
我们在以es6语法写业务逻辑代码的时候，通过webpack打包后在浏览器中运行，由于目前浏览器对es6语法的支持情况不同，有些浏览器不能解析es6的语法，导致我们的代码运行受阻，而babel就是帮我们解决这一大难点的。那babel该如何配置？它又是怎么使用的呢？
首先，我们需要在webpack.config.js文件中的module.exports中的module中对babel进行配置，而我们要使用babel，就需要安装babel-loader，@babel/core和@babel/preset-env，此时我们就可以将es6语法部分打包生成es5语法的打包文件，此时打包文件中还是有部分es6语法没有打包成es5语法，此时就需要借助另一个文件@babel/polyfill，在我们使用了es6语法的js文件中引入@babel/polyfill文件，当然在使用之前需要安装@babel/polyfill，此文件的作用就是填充我们之前没有转换成es5语法的那部分，让剩余es6部分也能转换成es5语法。
但是，我们的@babel/polyfill是将所有的无法将es6转换成es5的部分全部填充上来，这样就会导致我们的打包文件过大，此时就需要我们在webpack.config.js文件中配置一个useBuiltIns配置项，这个配置项的作用就是告诉@babel/polyfill文件只需要填充我们js文件中用到的那部分es6语法，而不用全部填充，此时，我们的打包文件就会减小。