Запретить gulp-htmllint пропускать неверные HTML-файлы

Я использую gulp-htmllint для проверки файлов с фрагментами HTML. Однако, к моему удивлению, он пропускает файлы с неверной разметкой. Я хотел бы получить "как можно лучше" linting, но, по крайней мере, я хочу, чтобы он потерпел неудачу / сообщить об ошибке на недействительном HTML.

Вот репродукция. Сначала gulpfile.js (требуется соответствующий npm install команды заранее):

var gulp = require("gulp"),
    gutil = require('gulp-util'),
    htmllint = require("gulp-htmllint"), 
    path = require('path');

gulp.task("default", [], function() {
    return gulp.src("src/*.html")
        .pipe(htmllint({}, reporter));
});

function reporter(filepath, issues) {
    var filename = path.basename(filepath);
    if (issues.length > 0) {
        issues.forEach(function (issue) {
            gutil.log(gutil.colors.cyan('[lintHtml] ') + gutil.colors.white(filename + ' [' + issue.line + ',' + issue.column + ']: ') + gutil.colors.red('(' + issue.code + ') ' + issue.msg));
        });
        process.exitCode = 1;
    }
}

reporter основан на примере на домашней странице пакета.

С этим src/fragment.html файл:

<span style="color: red;">Test 1.</span>
<span style="color: green;">Test 2.</span>

Я хорошо получу:

[08:04:06] Using gulpfile ~\myapp\gulpfile.js
[08:04:06] Starting 'default'...
[08:04:06] [lintHtml] fragment.html [1,6]: (E001) the `style` attribute is banned
[08:04:06] [lintHtml] fragment.html [2,6]: (E001) the `style` attribute is banned
[08:04:06] Finished 'default' after 38 ms

Но если я сделаю HTML-файл недействительным, вот так:

<span style="color: red;"Test 1.</span>
<span style="color: green;">Test 2.</span>

Я получил:

[08:05:06] Using gulpfile ~\myapp\gulpfile.js
[08:05:06] Starting 'default'...
[08:05:06] Finished 'default' after 25 ms

Как будто нет ничего плохого.

Как заставить процесс сообщать об ошибках и терпеть неудачу, когда у моего фрагмента есть такая проблема?

PS. Я закончил кросс-постом на Github как проблему.

1 ответ

Решение

Нет способа сделать это без изменений самого gulp-htmllint. Если вы посмотрите на источник, то увидите, что он обеспечивает только обработчик успеха для обещания htmllint:

lint.then(function(issues) {
    issues.forEach(function(issue) {
        issue.msg = issue.msg || htmllint.messages.renderIssue(issue);
    });
    reporter(file.path, issues);
});

Чтобы вывести случаи, когда процесс linting завершается неудачно из-за недопустимого html, он также должен предоставить обработчик отклонения:

lint.then(function(issues) {
    issues.forEach(function(issue) {
        issue.msg = issue.msg || htmllint.messages.renderIssue(issue);
    });
    reporter(file.path, issues);
}).catch(function(error) {
    //do something useful here
    console.log(file.path + ': ' + error.toString());
});

Это означает, что у вас есть два варианта:

  • Форкируйте проект на github и реализуйте это сами
  • Найдите другой плагин gulp, который делает это (возможно, gulp-htmlhint или gulp -html5-lint?)
Другие вопросы по тегам