如何使用 gulp-eslint 修复文件？答案

【问题标题】：How to fix files with gulp-eslint?如何使用 gulp-eslint 修复文件？
【发布时间】：2016-09-03 15:06:43
【问题描述】：

我将 gulp 与 eslint 一起使用。

没有 gulp，我只运行eslint ./src --fix。我不知道如何用 gulp 做到这一点。我在下面尝试过，将 fix 设置为 true，但它没有修复任何文件：

gulp.task('lint', ['./src/**.js'], () => {
return gulp.src()
    .pipe($.eslint({fix:true}))
    .pipe($.eslint.format())
    .pipe($.eslint.failAfterError());
});

我希望修复./src 下的所有文件。我如何做到这一点？

【问题讨论】：

标签： node.js gulp eslint

【解决方案1】：

这是在我的项目中工作的正确方法：

var gulp = require('gulp'),
    eslint = require('gulp-eslint'),
    gulpIf = require('gulp-if');


function isFixed(file) {
    // Has ESLint fixed the file contents?
    return file.eslint != null && file.eslint.fixed;
}


gulp.task('lint', function () {
    // ESLint ignores files with "node_modules" paths.
    // So, it's best to have gulp ignore the directory as well.
    // Also, Be sure to return the stream from the task;
    // Otherwise, the task may end before the stream has finished.
    return gulp.src(['./src/**.js','!node_modules/**'])
        // eslint() attaches the lint output to the "eslint" property
        // of the file object so it can be used by other modules.
        .pipe(eslint({fix:true}))
        // eslint.format() outputs the lint results to the console.
        // Alternatively use eslint.formatEach() (see Docs).
        .pipe(eslint.format())
        // if fixed, write the file to dest
        .pipe(gulpIf(isFixed, gulp.dest('../test/fixtures')))
        // To have the process exit with an error code (1) on
        // lint error, return the stream and pipe to failAfterError 
        // last.
        .pipe(eslint.failAfterError());
});

gulp.task('default', ['lint'], function () {
    // This will only run if the lint task is successful...
});

【讨论】：

为什么这是“正确的方式”？特别是为什么要删除“FailAfterError()”？
您使用的是“gulp-if”包，对吗？您的示例中没有引用它。考虑到这一点，并使用包示例中使用的命名样式，我有以下工作代码用于输出：.pipe(gulpif(isFixed, gulp.dest('./')));

【解决方案2】：

老问题，但添加.pipe(gulp.dest(file => file.base)) 是它对我有用的原因。如：

gulp.task('lint', ['./src/**.js'], () => {
return gulp.src()
    .pipe($.eslint({fix:true}))
    .pipe($.eslint.format())
    .pipe(gulp.dest(file => file.base)) // <-- NEW: Output fixed version of file.
    .pipe($.eslint.failAfterError());
});

【讨论】：

【解决方案3】：

我使用gulp-eslint-new，因为 gulp-eslint 没有维护。

它有一个方法gulpESLintNew.fix()来修复文件，在自述文件中有说明。

使用 ESLint 提供的固定内容覆盖文件。这应该与gulpESLintNew(options) 中的选项fix 一起使用。没有修复的文件和 ESLint 未处理的文件将保持不变。

还有一个example：

function lintNFix() {
  return src('demo/**/*.js').pipe(gulpESLintNew({ fix: true }))
                            .pipe(gulpESLintNew.format())
                            // If a file has a fix, overwrite it.
                            .pipe(gulpESLintNew.fix());
}

【讨论】：