webpack - Webpack 带有 babel 加载器的多个预设以及键值对

Question

---

工作时有一个问题，我发现很难为 babel loader 配置预设，看看，让我知道需要做什么才能修复它。我不打算写整个 webpack 文件，只是我发现问题的一部分。任何帮助将不胜感激

 module: {
rules: [{
    test: /\.js?$/,
    use: {
      loader: 'babel-loader',
      options: {
        presets: [
          ['@babel/preset-env', {
            loose: true,
            modules: 'commonjs'
          }, 'es2015', 'react'],
        ],
        plugins: ['transform-es2015-template-literals'],
      },
    },
    include: new RegExp('/node_modules\/(' +
      '|acorn-jsx' +
      '|d3-array' +
      '|debug' +
      '|newspack-components' +
      '|regexpu-core' +
      '|unicode-match-property-ecmascript' +
      '|unicode-match-property-value-ecmascript)/'
    ),
  }]

Answer 1

您将预设放在错误的位置（在预设的定义中es2015）。react'@babel/preset-env'

它应该是：

presets: [
    [
        '@babel/preset-env',
        {
            loose: true,
            modules: 'commonjs'
        },
    ],
    'es2015',
    'react'
],