eslint-webpack-plugin v 2.1.0

webpack 的 ESLint 插件

关于插件

该插件诞生的目的是解决eslint-loader存在的问题。

eslint-webpack-plugin eslint-loader
配置简单 YES NO
生成唯一的输出报告 YES NO
直接使用 eslint 的缓存 YES NO
仅改变文件 YES NO

eslint-loader迁移

eslint-loader将很快被弃用,请使用这个插件。

以前:

module.exports = {
  // ...
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'eslint-loader',
        options: {
          // eslint options (if necessary)
        },
      },
    ],
  },
  // ...
};
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

以后:

const ESLintPlugin = require('eslint-webpack-plugin');

module.exports = {
  // ...
  plugins: [new ESLintPlugin(options)],
  // ...
};
1
2
3
4
5
6
7

安装

npm install eslint-webpack-plugin --save-dev
1

当然您还是需要安装eslint的,如果没有的话:

npm install eslint --save-dev
1

使用

在你的 webpack 配置中:

const ESLintPlugin = require('eslint-webpack-plugin');

module.exports = {
  // ...
  plugins: [new ESLintPlugin(options)],
  // ...
};
1
2
3
4
5
6
7

配置项

您可以传入eslint 配置

注意,您提供的配置选项将被传递给 ESLint 类。这是与您在package.json.eslintrc中的配置项并不相同。有关更多细节,请参阅eslint文档

options属性 类型 默认值 描述
context String compiler.context 指定文件根目录的字符串。
eslintPath String eslint 用于检索的eslint实例路径。如果eslintPath是文件夹,您可以指定formatter配置项。现在你不需要安装eslint了。
files String|Array[String] . 指定查找文件的通配符。必须相对于options.context。递归遍历目录,查找与options.extensions相符合的文件。文件和通配符会忽略options.extensions
extensions String|Array[String] js 指定要被检查的扩展名。
fix Boolean false 如果设置为true,将启用自动修复注意: 该项会改变源文件。
formatter String|Function stylish 接受有一个参数的函数:一个 eslint 消息数组(对象)。该函数输出必须以字符串的形式返回。您可以使用官方的eslint格式化程序
lintDirtyModulesOnly Boolean false 仅改变文件,并在开始时跳过。

报错和警告

默认情况下,插件会根据eslint错误/警告数目自动调整错误报告。您仍然可以通过使用emitErroremitWarning配置项强制执行抛出错误和警告:

options属性 类型 默认值 描述
emitError Boolean false 如果为true的话则总是返回错误。
emitWarning Boolean false 如果为true的话则总是返回警告。
failOnError Boolean false 如果设置为true的话,那么当触发任何错误的时候,将导致构建失败。
failOnWarning Boolean false 如果设置为true的话,那么有任何警告的时候,将导致构建失败。
quiet Boolean false 如果设置为true,将仅处理和报告错误并忽略警告。
outputReport Boolean|Object false 将错误的输出写入一个文件,例如用于报告Jenkins CIcheckstyle xml文件。
filePath是一个绝对路径,或是 webpack 配置中output.path的相对路径。您可以为输出文件传入不同的formatter, 如果没有传,将使用默认/配置的格式化程序。