A plugin for Gulp
npm install gulp-htmlhint> htmlhint wrapper for gulp to validate your HTML
First, install gulp-htmlhint as a development dependency:
``shell`
npm install --save-dev gulp-htmlhint
Then, add it to your gulpfile.js:
`javascript
var htmlhint = require("gulp-htmlhint");
gulp.src("./src/*.html")
.pipe(htmlhint())
`
#### options
See all rules here: https://github.com/HTMLHint/HTMLHint/wiki/Rules
If options is empty, the task will use standard options.
##### options.htmlhintrc
Type: Stringnull
Default value:
If this filename is specified, options and globals defined there will be used. Task and target options override the options within the htmlhintrc file. The htmlhintrc file must be valid JSON and looks something like this:
`json`
{
"tag-pair": true
}
`javascript
var htmlhint = require("gulp-htmlhint");
gulp.src("./src/*.html")
.pipe(htmlhint('.htmlhintrc'))
`
#### customRules
Type: Array _Optional_null
Default value:
Array that contains all user-defined custom rules. Rules added to this param need not exist in the htmlhintrc file.
All rules inside this array should be valid objects and look like this:
`javascript`
{
id: 'my-custom-rule',
description: 'Custom rule definition',
init: function(parser, reporter){
//Code goes here
}
}
Here is an example:
`javascript
var htmlhint = require("gulp-htmlhint");
var customRules = [];
customRules.push({
id: 'my-custom-rule',
description: 'Custom rule definition',
init: function(parser, reporter){
//Code goes here
}
});
gulp.src("./src/*.html")
.pipe(htmlhint('.htmlhintrc', customRules))
`
Note: You can call htmlhint function four different ways:
- Without params (task will use standard options).
- With options param alone.customRules
- With param alone (task will only use custom rules options).options
- With both and customRules params defined.
javascript
var htmlhint = require("gulp-htmlhint");gulp.src("./src/*.html")
.pipe(htmlhint())
.pipe(htmlhint.reporter())
`
$3
#### failOnError
Use this reporter if you want your task to fail on the first file that triggers an HTMLHint Error.
It also prints a summary of all errors in the first bad file.
`javascript
var htmlhint = require("gulp-htmlhint");gulp.src("./src/*.html")
.pipe(htmlhint())
.pipe(htmlhint.failOnError())
`#### failAfterError
Use this reporter if you want to collect statistics from all files before failing.
It also prints a summary of all errors in the first bad file.
`javascript
var htmlhint = require("gulp-htmlhint");gulp.src("./src/*.html")
.pipe(htmlhint())
.pipe(htmlhint.failAfterError())
`#### Reporter options
Optionally, you can pass a config object to either fail reporter.
##### suppress
Type:
Boolean
Default value: false When set to
true, errors are not displayed on failure.
Use in conjunction with the default and/or custom reporter(s).
Prevents duplication of error messages when used along with another reporter.
`javascript
var htmlhint = require("gulp-htmlhint"); gulp.src("./src/*.html")
.pipe(htmlhint())
.pipe(htmlhint.reporter("htmlhint-stylish"))
.pipe(htmlhint.failOnError({ suppress: true }))
``gulp-reporter used in team project, it fails only when error belongs to the current author of git.
[npm-url]: https://npmjs.org/package/gulp-htmlhint
[npm-image]: https://badge.fury.io/js/gulp-htmlhint.svg
[ci-url]: https://github.com/addyosmani/bezoerb/actions?workflow=Tests
[ci-image]: https://github.com/addyosmani/bezoerb/workflows/Tests/badge.svg