Whats the difference when configuring webpack babe

问题:

Hi please help me understand the differences between setting babel config inside .babelrc vs webpack loader options, vs inserting it in package.json.

For example, Would it make any difference if I put the presets in the webpack babel-loader options vs package.json or a separate .babelrc config file?

In webpack config:

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

In package json:

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

回答1:

Webpack config :

config the babel-loader completely in webpack.conf.js (no .babelrc).

Webpack config + .babelrc :

Enable the babel-loader in webpack.conf.js, let the options object be empty. Configure the options in a .babelrc. Webpack will use the babel-loader with the options given in .babelrc.

you can remove the webpack presets options if you have a .babelrc, because babel-loader uses babel, which obviously respects the .babelrc.