# htmlcs
> html hint tool, focused on semantic code style.
Latest version **0.4.1** (published 2017-06-12) · MIT license · 0 weekly downloads
## Install
```sh
npm install htmlcs
pnpm add htmlcs
yarn add htmlcs
bun add htmlcs
```
Provides the command `htmlcs`.
## Health
**Score 15/100 (F)** — status: abandoned.
Positive: no vulnerabilities.
Warnings: low downloads; no types; no esm support; pre 1.0.
Negative: abandoned; low maintenance score.
## Facts
| | |
|---|---|
| Version | 0.4.1 |
| Published | 2017-06-12 |
| First published | 2014-11-27 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >=4 |
| Dependencies | 12 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 46 |
| Author | nighca@live.cn |
| Maintainers | ecomfe |
| Keywords | html, hint, lint, semantic |
## Links
- npm: https://www.npmjs.com/package/htmlcs
- Repository: https://github.com/ecomfe/htmlcs
- Issues: https://github.com/ecomfe/htmlcs/issues
- npm.io page: https://npm.io/package/htmlcs
## Dependencies (12)
- [exit](https://npm.io/package/exit.md) ^0.1.2
- [walk](https://npm.io/package/walk.md) ^2.3.9
- [manis](https://npm.io/package/manis.md) ^0.3.0
- [yargs](https://npm.io/package/yargs.md) ^8.0.1
- [css-select](https://npm.io/package/css-select.md) ^1.1.0
- [differ-cli](https://npm.io/package/differ-cli.md) ^0.3.0
- [jformatter](https://npm.io/package/jformatter.md) stable
- [cssbeautify](https://npm.io/package/cssbeautify.md) ^0.3.1
- [htmlparser2](https://npm.io/package/htmlparser2.md) ^3.8.2
- [html-code-gen](https://npm.io/package/html-code-gen.md) stable
- [domelementtype](https://npm.io/package/domelementtype.md) ^1.1.3
- [html-nest-rule](https://npm.io/package/html-nest-rule.md) stable
## Alternatives
- [eslint-plugin-sonarjs](https://npm.io/package/eslint-plugin-sonarjs.md) — 2.9M weekly downloads
- [eslint-config-expo](https://npm.io/package/eslint-config-expo.md) — 1.5M weekly downloads
- [@matter/protocol](https://npm.io/package/@matter/protocol.md) — 63.5K weekly downloads
- [@eventcatalog/linter](https://npm.io/package/@eventcatalog/linter.md) — 24.8K weekly downloads
- [@pandacss/eslint-plugin](https://npm.io/package/@pandacss/eslint-plugin.md) — 18.7K weekly downloads
## Recent versions
- 0.4.1 (latest) — 2017-06-12
- 0.3.0 (stable) — 2017-02-20
- 0.4.0 — 2017-05-10
- 0.2.9 — 2016-10-03
- 0.2.8 — 2016-08-01
- 0.2.7 — 2016-07-31
- 0.2.6 — 2016-07-31
- 0.2.5 — 2016-07-31
- 0.2.4 — 2016-07-20
- 0.2.4-beta.2 — 2016-07-13
- 0.2.4-beta.1 — 2016-07-12
- 0.2.3 — 2016-07-08
- 0.2.2 — 2016-07-08
- 0.2.1 — 2016-04-22
- 0.2.0 — 2016-04-18
- … 25 more at https://npm.io/package/htmlcs/versions
## README
htmlcs
========
[](http://travis-ci.org/ecomfe/htmlcs)
[](https://www.npmjs.com/package/htmlcs)
[](https://coveralls.io/r/ecomfe/htmlcs)
[](https://david-dm.org/ecomfe/htmlcs)
[](https://david-dm.org/ecomfe/htmlcs)
HTML code style check & format tool.
### Install
npm i -g htmlcs
### Usage
* in CLI
```shell
Usage: htmlcs [options] [target...]
Commands:
hint Do hint given file(s)
format Do format given file(s)
Options:
-h, --help Show help [boolean]
-c, --config Path to custom configuration file. [string]
--diff Check code style and output char diff. [boolean]
-i, --in-place Edit input files in place; use with care! [boolean]
-v, --version Show version number [boolean]
Examples:
htmlcs hint foo.html do hint foo.html
htmlcs hint foo.html bar.html do hint foo.html & bar.html
htmlcs hint ./ do hint html files under ./
htmlcs format foo.html do format foo.html
htmlcs format --diff foo.html do format foo.html & show diff result
htmlcs format --in-place foo.html do format foo.html & write file in place
```
* in Node.js / browser (with [browserify](https://github.com/substack/node-browserify))
* hint file
```javascript
var htmlcs = require('htmlcs');
var result = htmlcs.hintFile(filePath);
```
* hint code (string)
```javascript
var htmlcs = require('htmlcs');
var result = htmlcs.hint(code);
// Or
htmlcs.hintAsync(code).then(
result => { /* ... */ }
);
```
* use hint result
```javascript
result.forEach(function(item){
console.log(
'[%s] line %d, column %d: %s (%s, %s)',
item.type,
item.line,
item.column,
item.message,
item.rule,
item.code
);
});
```
* format file
```javascript
var htmlcs = require('htmlcs');
console.log(htmlcs.formatFile(filePath));
```
* format code (string)
```javascript
var htmlcs = require('htmlcs');
console.log(htmlcs.format(code));
// Or
htmlcs.formatAsync(code).then(
result => console.log(result)
);
```
* add rule
```javascript
var htmlcs = require('htmlcs');
htmlcs.addRule({
name: 'test-rule',
desc: 'Just a test rule.',
lint: function (getCfg, document, reporter) {
reporter.warn(
1,
'099',
'This is a test waring!'
);
}
});
var result = htmlcs.hint(code);
```
* with Gulp/Grunt
There is no official Gulp/Grunt plugin yet. We recommend [fecs](https://github.com/ecomfe/fecs), which uses htmlcs to hint HTML code and provides a wealth of tools.
- [fecs-gulp](https://github.com/ecomfe/fecs-gulp)
- [fecs-grunt](https://github.com/ecomfe/fecs-grunt)
### Rules & Codes
[lib/rules/](./lib/rules/)
[rule map](./lib/default/rule-map.json)
### Config
* default: [lib/default/.htmlcsrc](./lib/default/htmlcsrc)
* custom:
Custom rule file (.htmlcsrc) can be placed in the same/parent directory of target file, or the `~/` directory.
If found in neither paths, the default config will be used.
* inline:
- disable
```html
```
- enable
```html
```
- config
```html
```
### Relative third-party tools
* [grunt-htmlcs](https://github.com/RRMoelker/grunt-htmlcs)
---
_Source: https://npm.io/package/htmlcs · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._