主要是照顾低版本浏览器兼容问题

官方连接:ES6转ES5

由babel开发

1、安装依赖

npm install -D babel-loader @babel/core @babel/preset-env webpack

2、配置

  rules: [
    {
      test: /\.m?js$/,
      exclude: /(node_modules|bower_components)/,//不转换node_model里面的第三方包
      use: {
        loader: ‘babel-loader‘,
        options: {
          presets: [‘env‘]
        }
      }
    }
  ]

2、配置 babel-polyfill 来解决低版本浏览器不支持的API的问题

2.1、安装

npm i -D babel-polyfill

2.2 配置

entry:[‘babel-polyfill‘,‘./src/main.js‘],

这样就会在打包的结果中提供一个垫脚片用以兼容低版本浏览器中的不支持的API

3、 配置transform-runtime 来解决代码重复问题

在打包过程中，babel会在某些包提供一些工具函数，而这些工具函数可能会重复在多个模块中，这样就会导致打包体积过大，所以babel提供了一个babel-transform-runtime来解决这个打包体积过大的问题
webpack中官方连接

3.1 安装

npm install -D @babel/plugin-transform-runtime
npm install @babel/runtime

3.2 配置

plugins: [‘@babel/plugin-transform-runtime‘]

ES6转ES5