webpack babel loader与eslint laoder合作

Question

我在使用webpack babel-loader和es-lint，就像这样。

  {
    test: /\.(js)$/,
    exclude: /node_modules/,
    use: ['babel-loader', 'eslint-loader'],
  },

但是在babel-loader中，我在webpack中看到，我必须通过这样的选项。

options: {
  presets: ['@babel/preset-env']
}

但是由于我使用的是数组加载器，所以不能使用这个选项，或者由于我使用的是eslint和babel loader，所以不需要这个@babelpreset env？

Answer 1

你可能还是想使用 @babel/preset 即使 eslint-loader

@babel/preset-env 是一个智能预设，它允许您使用最新的JavaScript，而不需要微观管理您的目标环境需要哪些语法转换（以及可选的浏览器polyfills）。这既让您的生活变得更轻松，也让JavaScript捆绑包变得更小! (源头)

该 eslint-loader 将使所有由 Webpack 捆绑的代码被 eslint 检查语法 (遵循您的 eslint 配置)。

您可以将babel的配置保存在一个单独的文件中。.babelrc.json:

{
  presets: [
    '@babel/preset-env'
  ]
}

use: [{ 
  loader: 'babel-loader',
  options: { presets: ['@babel/preset-env'] },
}, { 
  loader: 'eslint-loader'
}]