vue 打包时将es6转成es5代码

前言

最近上线一个项目，有win7的配置，还有很多其他浏览器，qq浏览器，360浏览器等等很多浏览器（笑脸表情）我正常打包之后我和后端都可以正常运行，都是win10的，其他办公司几个win7的都没法用，出现很多莫名奇妙的错误，最大的问题就是白屏，加载不出来登陆页面，但是浏览器上面的标题时出来了，很多不应该出来的报错，一直找不到问题，后来发现是不兼容，es6代码。

有需要去掉打包时的代码的注释的点这里，本来是两篇文章写一块的，但是考虑到有的不需要转换代码考虑兼容的情况就分开来写了，

一，安装 Babel 相关依赖：

npm install --save-dev @babel/core @babel/preset-env babel-loader

二，配置 Babel：

在项目根目录下创建一个名为 .babelrc 的文件，用来配置 Babel 的转换规则。在 .babelrc 文件中添加如下内容：

{
  "presets": ["@babel/preset-env"]
}

三，在 vue.config.js 中配置 Babel：

// vue.config.js
module.exports = {
  configureWebpack: {
    module: {
      rules: [
        {
          test: /\.js$/,
          exclude: /node_modules/,
          use: {
            loader: 'babel-loader'
          }
        }
      ]
    }
  }
};

四，怎么看打包后的代码是否已经转换成es5代码

去打包后的dist文件中，随便找一个.js文件，

检查是否有function ，以及你定义函数时候的const，let，等是不是全部变成var，这两点就可以证明是转换成功