gulp常用插件之gulp-eslint使用

更多gulp常用插件使用请访问：gulp常用插件汇总

---

** gulp-eslint**这是一个用于识别和报告在ECMAScript/JavaScript代码中找到的模式的Gulp插件。。

更多使用文档请点击访问gulp-eslint工具官网。

安装

一键安装不多解释

npm install --save-dev gulp-eslint

使用

基础使用：

const {src, task} = require('gulp');
const eslint = require('gulp-eslint');

task('default', () => {
    return src(['scripts/*.js'])
        // eslint（）将lint输出附加到“eslint”属性 以供其它模块使用
        .pipe(eslint())
        // format（）将lint结果输出到控制台。
        // 或者使用eslint.formatEach（）（参见文档）。
        .pipe(eslint.format())
        // 使进程退出时具有错误代码（1）
        // lint错误，最后将流和管道返回failAfterError。
        .pipe(eslint.failAfterError());
});

或使用插件API进行以下操作：

gulp.src(['**/*.js','!node_modules/**'])
	.pipe(eslint({
		rules: {
			'my-custom-rule': 1,
			'strict': 2
		},
		globals: [
			'jQuery',
			'$'
		],
		envs: [
			'browser'
		]
	}))
	.pipe(eslint.formatEach('compact', process.stderr));

有关其他示例，请浏览example目录。

API

eslint()

没有明确的配置。可以相对于每个linted文件解析.eslintrc文件。

eslint(options)

请参阅ESlint CLIEngine选项。

options.rules

类型： Object

默认值：null

一套配置的规则。

{
	"rules":{
		"camelcase": 1,
		"comma-dangle": 2,
		"quotes": 0
	}
}

options.globals

类型: Array

默认值：[]

指定要声明的全局变量。

{
	"globals":[
		"jQuery",
		"$"
	]
}

options.fix

类型： Boolean

默认值：false

此选项指示ESLint尝试修复尽可能多的问题。修正被应用到gulp流。固定内容可以使用gulp.dest保存到文件中（参见example/fix.js）。可修复的规则可以在ESLint的规则列表中找到。

应用修复程序时，在修复文件的ESLint结果中将“fixed”属性设置为true。

options.quiet

类型： Boolean

如果为true，则此选项将从ESLint结果中过滤警告消息。这模仿了ESLint CLI 安静选项。

类型： function (message, index, list) { return Boolean(); }

当提供一个函数时，它将用于筛选ESLint结果消息，删除任何不返回true（或真实）值的消息。

options.envs

类型：Array

默认值：[]

指定要应用的环境列表。

options.rulePaths

类型： Array

默认值：[]

此选项允许您指定从中加载规则文件的其他目录。当您有不适合与ESLint捆绑在一起的自定义规则时，这非常有用。此选项的工作方式与ESLint CLI的rulesdir选项非常类似。

options.configFile

类型：String

默认值：null

ESLint规则配置文件的路径。有关更多信息，请参阅ESLint CLI 配置选项和使用配置文件。

options.warnFileIgnored

类型： Boolean

如果为true，则在ESLint忽略文件时添加结果警告。这可用于归档gulp.src不必要加载的文件。例如，由于ESLint会自动忽略“node_modules”文件路径，而gulp.src则不会，因此一个gulp任务仅从“node_modules”目录读取文件可能需要几秒钟的时间。

options.useEslintrc

类型： Boolean

默认值：true

false启用时，ESLint将不加载.eslintrc文件。

eslint(configFilePath)

类型： String

定义的简写options.configFile。

eslint.result(action)

类型: function (result) {}

为每个ESLint文件结果调用一个函数。不需要返回值。如果抛出一个错误，它将被包装在一个Gulp PluginError中并从流中发出。

gulp.src(['**/*.js','!node_modules/**'])
	.pipe(eslint())
	.pipe(eslint.result(result => {
	    // 为每个ESLint结果调用。
	    console.log(`ESLint result: ${result.filePath}`);
	    console.log(`# Messages: ${result.messages.length}`);
	    console.log(`# Warnings: ${result.warningCount}`);
	    console.log(`# Errors: ${result.errorCount}`);
	}));

类型： function (result, callback) { callback(error); }

为每个ESLint文件结果调用异步函数。必须调用回调才能完成流。如果一个值被传递给回调，它将被包装在一个Gulp PluginError中并从流中发出。

eslint.results(action)

类型: function (results) {}

在流完成之前，对所有ESLint文件结果调用一次函数。不需要返回值。如果抛出一个错误，它将被包装在一个Gulp PluginError中并从流中发出。

结果列表有一个“warningCount”属性，它是所有结果中警告的总和；同样，“errorCount”属性设置为所有结果中错误的总和。

gulp.src(['**/*.js','!node_modules/**'])
	.pipe(eslint())
	.pipe(eslint.results(results => {
    	// 调用一次对所有ESLint结果。
	    console.log(`Total Results: ${results.length}`);
	    console.log(`Total Warnings: ${results.warningCount}`);
	    console.log(`Total Errors: ${results.errorCount}`);
	}));

类型： function (results, callback) { callback(error); }

在流完成之前，对所有ESLint文件结果调用一次异步函数。必须调用回调才能完成流。如果一个值被传递给回调，它将被包装在一个Gulp PluginError中并从流中发出。

eslint.failOnError()

如果已报告任何文件的ESLint错误，请停止任务/流。

// 在将无效的JS文件复制到输出目录之前，导致流停止（/fail）
gulp.src(['**/*.js','!node_modules/**'])
	.pipe(eslint())
	.pipe(eslint.failOnError());

eslint.failAfterError()

如果已报告任何文件的ESLint错误，请停止任务/流，但请先处理所有文件。

// 如果发生任何ESLint错误，请在流结束时使流停止（/fail）。
gulp.src(['**/*.js','!node_modules/**'])
	.pipe(eslint())
	.pipe(eslint.failAfterError());

eslint.format(formatter, output)

格式化所有文件一次。这应该在通过eslint进行管道传输后在流中使用；否则，将找不到要格式化的eslint结果。

formatter参数可以是String、Function或undefined。作为String，具有该名称或路径的格式化程序模块将被解析为相对于process.cwd()的模块，或作为ESLint提供的格式化程序之一的模块。如果undefined ，则将解析ESLint“stylish”格式化程序。将调用一个Function，其中包含要格式化的文件linting结果数组(Array)。

// 使用默认的“`stylish`”ESLint格式化程序
eslint.format()

// 使用“ checkstyle” ESLint格式化程序
eslint.format('checkstyle')

// 使用“ eslint-path-formatter”模块格式化程序
// (@see https://github.com/Bartvds/eslint-path-formatter)
eslint.format('node_modules/eslint-path-formatter')

output参数可以是一个WritableStream，Function或undefined。作为WritableStream，格式化程序结果将写入流。如果undefined，格式化程序结果将写入gulp的log。Function将使用格式化程序结果作为唯一参数来调用。

// 写入gulp的日志（默认）
eslint.format();

// 向stdout写入消息
eslint.format('junit', process.stdout)

eslint.formatEach(formatter, output)

分别格式化每个文件。这应该在通过eslint进行管道传输后在流中使用；否则，将找不到要格式化的eslint结果。

formatEach的参数与的参数相同format。

Configuration(配置)

ESLint可以使用以下任何插件选项进行显式配置：config、rules、globals或env。如果useEslintrc选项未设置为false，则ESLint将尝试在要linted的文件所在的目录中解析名为.eslintrc的文件。如果在那里找不到，将搜索父目录，直到找到.eslintrc或到达目录根目录。

Ignore Files(忽略文件)

ESLint将忽略在linting点没有.js文件扩展名的文件（有些插件可能会在流中更改文件扩展名）。这样可以避免无意中对非JavaScript文件进行linting操作。

ESLint还将在cwd或父目录中检测到.eslintignore文件。请参阅ESLint文档以了解如何构造此文件。

Extensions (扩展名)

ESLint结果作为“ESLint”属性附加到通过Gulp.js流管道的乙烯基文件。这可用于跟随初始eslint流的流。eslint.result和eslint.results方法可用于支持对eslint结果的扩展和自定义处理。