配置webpack babel-loader与在package.json中进行配置有什么区别? [英] Whats the difference when configuring webpack babel-loader vs configuring it within package.json?

问题描述

您好，请帮助我了解在.babelrc和Webpack loader选项之间设置babel config与将其插入package.json中的区别.

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

例如，如果将预设放入webpack babel-loader选项vs package.json或单独的.babelrc配置文件中，会有所不同吗?

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?

在webpack配置中:

In webpack config:

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

在json包中:

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

推荐答案

Webpack配置:

Webpack config :

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

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

Webpack配置+ .babelrc:

Webpack config + .babelrc :

在webpack.conf.js中启用babel-loader，让options对象为空. 在.babelrc中配置选项. Webpack将使用babel-loader和.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.

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

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

这篇关于配置webpack babel-loader与在package.json中进行配置有什么区别?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！