1- 使用es6语言

    "@babel/core": "^7.11.6",
    "@babel/preset-env": "^7.11.5",
    "babel-loader": "^8.0.0-beta.0",

{
  test: /\.js$/,
  exclude: /(node_modules|bower_components)/,  // node_modules 目录或者其他不需要编译的源代码 
  use: {
    loader: 'babel-loader',
    options: {
      presets: [['@babel/preset-env', {       // 预设环境进行编译js，可以加入参数 https://www.jianshu.com/p/000c2670672b
        "targets": {
          "browsers": [
            "Firefox > 86"
          ]
        }
      }]]
    }
  },
  enforce: 'post',
  parser: {
    amd: false, // 禁用 AMD
    commonjs: true, // 禁用 CommonJS
    system: false, // 禁用 SystemJS
    harmony: false, // 禁用 ES2015 Harmony import/export
    requireInclude: false, // 禁用 require.include
    requireEnsure: false, // 禁用 require.ensure
    requireContext: false, // 禁用 require.context
    browserify: false, // 禁用特殊处理的 browserify bundle
    requireJs: false, // 禁用 requirejs.*
  },
},

Presets

presets 属性告诉 Babel 要转换的源码使用了哪些新的语法特性，一个 Presets 对一组新语法特性提供支持，多个 Presets 可以叠加。 Presets 其实是一组 Plugins 的集合，每一个 Plugin 完成一个新语法的转换工作。Presets 是按照 ECMAScript 草案来组织的，通常可以分为以下三大类：

1. 已经被写入 ECMAScript 标准里的特性，由于之前每年都有新特性被加入到标准里，所以又可细分为：它们之间的关系如图：
   • es2015 包含在2015里加入的新特性；
   • es2016 包含在2016里加入的新特性；
   • es2017 包含在2017里加入的新特性；
   • env 包含当前所有 ECMAScript 标准里的最新特性。
2. 被社区提出来的但还未被写入 ECMAScript 标准里特性，这其中又分为以下四种：它们之间的关系如图：
   • stage0 只是一个美好激进的想法，有 Babel 插件实现了对这些特性的支持，但是不确定是否会被定为标准；
   • stage1 值得被纳入标准的特性；
   • stage2 该特性规范已经被起草，将会被纳入标准里；
   • stage3 该特性规范已经定稿，各大浏览器厂商和 Node.js 社区开始着手实现；
   • stage4 在接下来的一年将会加入到标准里去。
3. 为了支持一些特定应用场景下的语法，和 ECMAScript 标准没有关系，例如 babel-preset-react 是为了支持 React 开发中的 JSX 语法。

在实际应用中，你需要根据项目源码所使用的语法去安装对应的 Plugins 或 Presets。