htmlhint-plugin-blocked-words
v1.0.2
Published
An [HTMLHint](https://htmlhint.com/) plugin that allows users to block arbitrary phrases in HTML code.
Downloads
34,755
Maintainers
Readme
htmlhint-plugin-blocked-words
An HTMLHint plugin that allows users to block arbitrary phrases in HTML code.
Installation
You probably want this as a dev dependency:
npm i -D htmlhint-plugin-blocked-words
Load into HTMLHint
CLI
If calling HTMLHint via its CLI, you'll need to use the --rulesdir
or -r
option for HTMLHint:
npx htmlhint index.html -r node_modules/htmlhint-plugin-blocked-words/dist/rules
JS API
If calling HTMLHint via its JS API (shown below as HTMLHint.verify
), you can use the addAllRules
export from this package:
import {readFileSync} from 'fs';
import {HTMLHint} from 'htmlhint';
import {addAllRules} from 'htmlhint-plugin-blocked-words';
// this must be added before your HTMLHint api calls. It only needs to be called once per process.
addAllRules();
const yourCode = readFileSync('filename.ts').toString();
HTMLHint.verify(yourCode);
Temporarily ignoring
Add the following comment to the top of a file to turn off a rule for that file. (Note that HTMLHint does not document this anywhere but it works.)
<!-- htmlhint block-words:false -->
<html>
<head>
<title>Document Title</title>
</head>
<body>
Stuff
</body>
</html>
Rules
block-words
This is the main (currently only) rule, used to block phrases in tag names, text, attribute names, or attribute values.
This rule accepts an object with the following type:
export type BlockWordsOptions = {
all?: string[];
attributeNames?: string[];
attributeValues?: string[];
tagNames?: string[];
text?: string[];
};
Each string in each array is treated as a regular expression, so RegExp syntax can be used. (Make sure to escape the backslash though, like this: "\\s"
.)
all
: checks each HTML node's entire raw text.attributeNames
: checks every attribute name (such asclass
,id
, or custom attributes).attributeValues
: checks every attribute's values (such asthis is a list of class names
in<div class="this is a list of class names"></div>
).tagNames
: checks every tag name (such asdiv
).text
: checks the text of each node (such asthis is some text
in<div>this is some text</div>
).
Turn off the rule by giving it a falsy value, such as false
, null
, or even an empty string ''
.
Example usage:
{
"block-words": {
"attributeValues": ["\\bbad-phrase\\b"]
}
}
With that given htmlhintrc
file, the following is invalid:
<div class="bad-phrase"></div>
While the following is valid:
<div>bad-phrase</div>
(To block bad-phrase
also in text, use the all
or text
property in the block-words
options.)