webpack - 配置 webpack babel-loader 与在 package.json 中配置有什么区别？

Question

嗨，请帮助我理解在 .babelrc 和 webpack 加载器选项中设置 babel 配置与在 package.json 中插入它之间的区别。

例如，如果我将预设放在 webpack babel-loader 选项与 package.json 或单独的 .babelrc 配置文件中，会有什么不同吗？

在 webpack 配置中:

          {
            test: /\.(js|jsx|mjs)$/,
            loader: require.resolve('babel-loader'),
            options: {
                 "presets": [
                    "react-app"
                  ]
            },
          },

在包 json 中:

  "babel": {
    "presets": [
      "react-app"
    ]
  },

Answer 1

网络包配置:

在 webpack.conf.js 中完全配置 babel-loader(没有 .babelrc)。

Webpack 配置 + .babelrc :

在 webpack.conf.js 中启用 babel-loader，让 options 对象为空。
在 .babelrc 中配置选项。 Webpack 将使用 babel-loader 和 .babelrc 中给出的选项。

如果你有 .babelrc，你可以删除 webpack 预设选项，因为 babel-loader 使用 babel，这显然尊重 .babelrc。