webpack 的 eslint 和 babel 设置与 .eslintrc 和 .babelrc 的关系答案

【问题标题】：webpack's eslint and babel settings relation to .eslintrc and .babelrcwebpack 的 eslint 和 babel 设置与 .eslintrc 和 .babelrc 的关系
【发布时间】：2019-01-01 01:41:56
【问题描述】：

eslint 和babel loader 的webpack's 设置与它们对应的文件.eslintrc 和.babelrc 之间有什么关系？

例如，在 webpack 中我有：

rules: [
                {
                    test: /\.(js|jsx)$/,
                    include: paths.SRC,
                    exclude: /node_modules/,
                    loader: 'babel-loader',
                }

没有传递任何选项，这是否意味着我应该在.babelrc 文件中定义选项？如果我不创建.babelrc 文件，我应该直接在webpack 中将presets 和plugins 传递给babel-loader，如下所示（eslint 相同）：

use: {
        loader: 'babel-loader',
        options: {
          presets: ['es2015', 'env', 'react'],
          plugins: ['transform-es2015-destructuring', 
          'transform-object-rest-spread', 
          'transform-class-properties'
          ],
        }
      }

【问题讨论】：

标签： webpack settings eslint babel-loader

【解决方案1】：

没有传递任何选项，这是否意味着我应该在 .babelrc 文件？

是的，否则 babel 将不知道应用什么。

如果我不创建 .babelrc 文件，我应该通过预设和 babel-loader 的插件直接在 webpack 中如下所示（对于 eslint):

通过选项传递预设和插件与创建.babelrc 文件相同。

同样的逻辑也适用于 eslint。

【讨论】：