LintHTML
The HTML5 linter and validator you need.
LintHTML is a fork of htmllint featuring a built-in CLI and multiple bug fixes and improvements. The migration from htmllint to LintHTML is easy, as all htmllint's rules can be used with LintHTML – just follow this simple guide.
Installation and Usage
You can install LintHTML either locally or globally. For most cases we recommend the former, which can be achieved this way with npm:
npm install @linthtml/linthtml --save-dev
You should then init a configuration file:
npx linthtml --init
This will generate a file .linthtmlrc
in the current directory.
After that, you can run LintHTML on any file or directory like this:
npx linthtml 'yourfile.html'
npx linthtml 'src/**/*.html'
If you want to read about alternative installation and usage methods, have a look to the installation and usage page in the documentation.
Migrate from htmllint
To migrate from htmllint to LintHTML, first remove all the htmllint-related packages you were using:
npm uninstall htmllint htmllint-cli
Then rename the file .htmlintrc
to .linthtmlrc
.
You might want to remove the rules indent-delta
and indent-width-cont
from there in case you were using them since LintHTML's indent style checker deals with those aspects out of the box.
Finally, install LintHTML:
npm install @linthtml/linthtml --save-dev
Rules
The list of current rules and deprecations can be found in here.
Global Configuration
By default, LintHTML will look for a JSON
, YAML
, or JavaScript
file named .linthtmlrc.*
or a linthtmlConfig
section in package.json
.
Anyway, you can specify a custom configuration file using the --config
option when running LintHTML in the command line.
See our documentation about configuration to see how to configure rules, use custom parser, plugins...
Inline Configuration
Sometimes it is necessary to disable a rule or tweak the configuration for a specific line, block or HTML file. This might be the case, for example, for an inline SVG block of code. This can be achieved by using inline configurations.
Inline configurations are HTML comments beginning with the keyword linthtml-XXX
.
XXX
can be replaced with the following values, which are called instructions.
Instructions have different effects:
configure
: change a rule configuration for the HTML nodes that followenable
: activate a rule which was has deactivated previouslydisable
: disable a rule
Configure instruction
Multiple rules can be set in a single inline configuration comment.
Values must be surrounded with double/single quotes if they contain spaces, and must be either a valid value for the rule (encoded in pretty-much-JSON) or the string $previous
(which is a special value that recalls the former value of the rule for your convenience).
Some examples:
- change the
tag-bans
rule value
<!-- linthtml-configure tag-bans="['p','style']" -->
<!-- linthtml-configure tag-bans=['p','style'] -->
- turn off the
attr-bans
rule
<!-- linthtml-configure attr-bans="false" -->
<!-- linthtml-configure attr-bans=false -->
<!-- linthtml-configure attr-bans="off" -->
We recommend using the enable/disable instructions instead 😉
- turn on the
attr-bans
rule
<!-- linthtml-configure attr-bans="true" -->
<!-- linthtml-configure attr-bans=true -->
⚠️ you can only turn on rules that have been deactivated by an inline config We recommend using the enable/disable instructions instead 😉
- restore the previous value of the
tag-bans
rule ⚠️ works only with the legacy config at the moment
<!-- linthtml-configure tag-bans="$previous" -->
It's worth noting that inline configurations only affect the file they're on, so if they are not explicitly reversed with the $previous
value, they will just apply until the end of the file.
Ecosystem
Apart from the built-in CLI, you might want to use some of the following tools to integrate LintHTML in different scenarios:
vscode-linthtml
: an extension for the VSCode IDEgulp-linthtml
: a gulp interface for LintHTML
🚧 Coming soon:
linthtml-loader
: LintHTML loader for webpackbroccoli-linthtml
: Integrates HTML linting with LintHTML as part of your Broccoli build pipeline
Contributing
Contributions are welcome, please make sure to use the proper GitHub tag on your issue/PR.
cli
: anything related to LintHTML's CLIrule
: anything related to the rules (bugs, improvements, docs, new rules...)core
: anything related to LintHTML's core (file parsing, plugin system...)