Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/linthtml/linthtml
The html5 linter and validator.
https://github.com/linthtml/linthtml
cli hint html lint linter linting static-code-analysis
Last synced: 3 months ago
JSON representation
The html5 linter and validator.
- Host: GitHub
- URL: https://github.com/linthtml/linthtml
- Owner: linthtml
- License: isc
- Created: 2019-02-20T16:40:21.000Z (over 5 years ago)
- Default Branch: develop
- Last Pushed: 2024-07-31T13:15:11.000Z (3 months ago)
- Last Synced: 2024-07-31T16:24:02.410Z (3 months ago)
- Topics: cli, hint, html, lint, linter, linting, static-code-analysis
- Language: TypeScript
- Homepage: linthtml.vercel.app
- Size: 8.41 MB
- Stars: 83
- Watchers: 5
- Forks: 14
- Open Issues: 27
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
- awesome-linters - LintHTML - LintHTML is a fork of (Linters / HTML)
README
# LintHTML
[](https://npmjs.org/package/@linthtml/linthtml)
[](https://npmjs.org/package/@linthtml/linthtml)
[](https://codebeat.co/projects/github-com-linthtml-linthtml-develop)
[](https://coveralls.io/github/linthtml/linthtml?branch=develop)
> The HTML5 linter and validator you need.
LintHTML is a fork of [htmllint](https://github.com/htmllint/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](#migrate-from-htmllint).
## 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:
```shell
npm install @linthtml/linthtml --save-dev
```
You should then init a configuration file:
```shell
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:
```shell
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](./doc/docs/user-guide/installation-and-usage.md) page in the documentation.
## Migrate from htmllint
To migrate from [htmllint](https://github.com/htmllint/htmllint) to LintHTML, first remove all the htmllint-related packages you were using:
```shell
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:
```shell
npm install @linthtml/linthtml --save-dev
```
## Rules
The list of current rules and deprecations can be found in [here](./doc/docs/user-guide/rules/list.md).
### 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](./doc/docs/user-guide/configuration.md) 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 follow
- `enable` : activate a rule which was has deactivated previously
- `disable` : 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).
Some examples:
* change the `tag-bans` rule value
```html
```
* turn off the `attr-bans` rule
```html
```
_We recommend using the enable/disable instructions instead 😉_
* turn on the `attr-bans` rule
```html
```
_⚠️ 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_
```html
```
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`](https://marketplace.visualstudio.com/items?itemName=kamikillerto.vscode-linthtml): an extension for the VSCode IDE
* [`gulp-linthtml`](https://github.com/linthtml/gulp-linthtml): a gulp interface for LintHTML
🚧 Coming soon:
* `linthtml-loader`: LintHTML loader for webpack
* `broccoli-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 CLI
* `rule`: anything related to the rules (bugs, improvements, docs, new rules...)
* `core`: anything related to LintHTML's core (file parsing, plugin system...)