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

Question

嗨，请帮助我了解在 .babelrc 与 webpack 加载器选项中设置 babel config 与将其插入 package.json 之间的区别。

例如，如果我将预设放在 webpack babel-loader options vs 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（没有 .babelrc）中完全配置 babel-loader。

Webpack 配置 + .babelrc ：

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

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

Answer 2

使用.babelrc比其他方法更好。

如果你把你的设置放在你的 Webpack 配置中，那么这些设置将只对 Webpack 可用。

如果你把你的设置放在 中.babelrc，那么这些设置将可用于Webpack 以及任何其他使用 babel 的工具。

来源（去投票吧！）