|
7 | 7 | [](https://www.npmjs.com/package/htmlhint) |
8 | 8 | [](https://discord.gg/nJ6J9CP) |
9 | 9 |
|
10 | | - |
11 | | - |
12 | 10 | HTMLHint is a Static Code Analysis Tool for HTML, you can use it with IDE or in build system. |
13 | 11 |
|
14 | | -## Getting started |
15 | | - |
16 | | -1. Installation & hints |
17 | | - |
18 | | - npm install htmlhint -g |
19 | | - htmlhint -V |
20 | | - htmlhint --help |
21 | | - htmlhint www |
22 | | - htmlhint www/test.html |
23 | | - htmlhint www/**/*.xhtml |
24 | | - htmlhint www/**/*.{htm,html} |
25 | | - htmlhint http://www.alibaba.com/ |
26 | | - cat test.html | htmlhint stdin |
27 | | - |
28 | | -2. Results |
29 | | - |
30 | | - test.html |
31 | | - L5 | </head> |
32 | | - ^ <title> must be present in <head> tag. (title-require) |
33 | | - L8 | </body> |
34 | | - ^ Tag must be paired, missing: [ </div> ], start tag match failed [ <div> ] on line 7. (tag-pair) |
35 | | - |
36 | | - 2 errors in 1 files |
37 | | - |
38 | | -3. Config rules |
39 | | - |
40 | | - search `.htmlhintrc` file in current directory and all parent directories: |
41 | | - |
42 | | - htmlhint |
43 | | - htmlhint test.html |
44 | | - |
45 | | - custom config file: |
46 | | - |
47 | | - htmlhint --config htmlhint.conf test.html |
48 | | - |
49 | | - custom rules: |
50 | | - |
51 | | - htmlhint --rules tag-pair,id-class-value=underline test.html |
52 | | - |
53 | | - Inline rules in `test.html`: |
54 | | - |
55 | | - <!--htmlhint tag-pair,id-class-value:underline --> |
56 | | - <html> |
57 | | - <head> |
58 | | - ... |
59 | | - |
60 | | -## Guide |
| 12 | +## 📟 Installation and Usage |
| 13 | + |
| 14 | +Prerequisites: Node.js (>=6.14), npm version 3+. |
| 15 | + |
| 16 | +There are two ways to install HTMLHint: globally and locally. |
| 17 | + |
| 18 | +### Local Installation and Usage |
| 19 | + |
| 20 | +In case you want to include HTMLHint as part of your project, you can install it locally using NPM: |
| 21 | + |
| 22 | +``` |
| 23 | +$ npm install htmlhint --save-dev |
| 24 | +``` |
| 25 | +After that, You can run HTMLHint on any file or directory like this: |
| 26 | +``` |
| 27 | +$ ./node_modules/.bin/htmlhint www/index.html |
| 28 | +$ ./node_modules/.bin/htmlhint www/**/*.html |
| 29 | +``` |
| 30 | +### Global Installation and Usage |
| 31 | + |
| 32 | +If you want to make HTMLHint available to tools that run across all of your projects, you can instal HTMLHint globally using NPM: |
| 33 | + |
| 34 | +``` |
| 35 | +$ npm install htmlhint -g |
| 36 | +``` |
| 37 | +After that, you can run HTMLHint on any file like this: |
| 38 | +``` |
| 39 | +$ htmlhint www/index.html |
| 40 | +$ htmlhint www/**/*.html |
| 41 | +``` |
| 42 | +You can even launch HTMLHint to analyse an URL: |
| 43 | +``` |
| 44 | +$ htmlhint https://htmlhint.io/ |
| 45 | +``` |
| 46 | +## 📃 Example output |
| 47 | + |
| 48 | + |
| 49 | +## 🔧 Configuration |
| 50 | + |
| 51 | +Search `.htmlhintrc` file in current directory and all parent directories: |
| 52 | +``` |
| 53 | +$ htmlhint |
| 54 | +$ htmlhint test.html |
| 55 | +``` |
| 56 | +Custom config file: |
| 57 | +``` |
| 58 | +$ htmlhint --config htmlhint.conf test.html |
| 59 | +``` |
| 60 | +Custom rules: |
| 61 | +``` |
| 62 | +$ htmlhint --rules tag-pair,id-class-value=underline index.html |
| 63 | +``` |
| 64 | + |
| 65 | +Inline rules in `test.html`: |
| 66 | +``` |
| 67 | +<!--htmlhint tag-pair,id-class-value:underline --> |
| 68 | +<html> |
| 69 | +<head> |
| 70 | +... |
| 71 | +``` |
| 72 | +## 🗺 Guide |
61 | 73 |
|
62 | 74 | 1. [How to use](https://github.com/thedaviddias/HTMLHint/wiki/Usage) |
63 | 75 | 2. [All Rules](https://github.com/thedaviddias/HTMLHint/wiki/Rules) |
64 | | -2. [How to Develop](https://github.com/thedaviddias/HTMLHint/wiki/Developer-guide) |
| 76 | +3. [How to Develop](https://github.com/thedaviddias/HTMLHint/wiki/Developer-guide) |
65 | 77 |
|
66 | | -## License |
| 78 | +## © License |
67 | 79 |
|
68 | | -[The MIT License](https://raw.githubusercontent.com/thedaviddias/HTMLHint/master/LICENSE). |
| 80 | +[MIT License](./LICENSE). |
69 | 81 |
|
70 | | -## Contributors |
| 82 | +## 💪🏻 Contributors |
71 | 83 |
|
72 | 84 | This project exists thanks to all these people. [Contribute](CONTRIBUTING.md). |
73 | 85 | <a href="https://github.com/thedaviddias/HTMLHint/graphs/contributors"><img src="https://opencollective.com/htmlhint/contributors.svg?width=890" /></a> |
74 | 86 |
|
75 | | -## Backers |
| 87 | +## 🏅 Backers |
76 | 88 |
|
77 | 89 | Thank you to all our backers! [Become a backer](https://opencollective.com/stylelint#backer). |
78 | 90 |
|
79 | 91 | <a href="https://opencollective.com/htmlhint#backers" target="_blank"><img src="https://opencollective.com/htmlhint/backers.svg?width=890"></a> |
80 | 92 |
|
81 | | -## Sponsors |
| 93 | +## 🎖 Sponsors |
82 | 94 |
|
83 | 95 | Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [Become a sponsor](https://opencollective.com/htmlhint#sponsor). |
84 | 96 |
|
|
0 commit comments