@markuplint/config-presets
Usage
To the extends property of the configuration, specify like below:
{
"extends": ["markuplint:recommended"]
}You can choose some presets appropriately for your preference.
{
"extends": ["markuplint:html-standard", "markuplint:a11y"]
}Ruleset Mapping
| Ruleset | Description | recommended |
recommended-vue |
recommended-svelte |
recommended-static-html |
recommended-react |
a11y |
code-styles |
compat |
html-standard |
performance |
rdfa |
security |
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Must not duplicate ID | Be able to avoid problems in assistive technologies from the viewpoint of machine readability. | ||||||||||||
Disallow accesskey attr |
|||||||||||||
<label> should have control |
|||||||||||||
| Use landmark | Split from the former landmark-roles rule (#3989); this group keeps its name and wraps only this one rule. The duplicated-landmark-labeling half lives in the new a11y/require-landmark-label sibling group below. |
||||||||||||
| Require a unique label for duplicated landmarks | Split from the former landmark-roles rule (#3989). |
||||||||||||
| Popover trigger and target must be adjacent | |||||||||||||
| No ambiguous Navigable Target Names | |||||||||||||
No consecutive <br> |
|||||||||||||
| No refer to no existent ID | |||||||||||||
| No broken fragment link | Split from the former no-refer-to-non-existent-id rule (#3989). Because no-refer-to-non-existent-id itself isn't renamed or deprecated, it gets no rule-aliases.ts entry — a hand-written config that enables only no-refer-to-non-existent-id keeps working unchanged but silently loses fragment link coverage. This group is how a11y-preset users keep it. |
||||||||||||
| No redundant accessible name sources | |||||||||||||
| Require accessible name | |||||||||||||
| Require autofocus in modal dialogs | |||||||||||||
Require <h1> |
Split from the former required-h1 rule (#3989); this group keeps its name and wraps only this one rule. The duplicate-<h1> half lives in the new a11y/no-duplicate-h1 sibling group below. |
||||||||||||
No duplicate <h1> |
|||||||||||||
| Align row and column | Split from the former table-row-column-alignment rule (#3989). This group keeps its name for anyone overriding it directly; the three table-model-error checks that split out alongside it (no-table-cell-overlap, no-table-span-overflow, no-empty-table-track) live in their own sibling groups below since their default severity, error, differs from this group's warning. |
||||||||||||
| No overlapping table cells | |||||||||||||
| No table cell span reaching past its row group | |||||||||||||
| No table row or column with no cell anchored to it | |||||||||||||
Use <ul> |
|||||||||||||
| Conform to WAI-ARIA | |||||||||||||
Require <html lang> |
|||||||||||||
Require <abbr title> |
|||||||||||||
Require <track> in media elements |
|||||||||||||
Require <video muted> when autoplay is set |
|||||||||||||
| No merge cells | |||||||||||||
<summary> must not contain interactive contents |
There is a case where an assistive technology can't access contents, or contents don't propagate a mouse event to <summary>. |
||||||||||||
Disallow autofocus attr outside dialog scope |
Don't take away focus by force. The dialog element and its descendants are excepted. |
||||||||||||
tabindex attr only -1 or 0 |
Scoped to non-dialog elements because the HTML spec disallows tabindex on <dialog> (noUse). |
||||||||||||
Disallow user-scalable=no in viewport meta |
Usage of user-scalable=no can cause accessibility issues to users with visual impairments such as low vision. WCAG requires a minimum of 2× scaling. |
||||||||||||
| Consistent attribute name casing | HTML permits any mix of ASCII upper/lower case in attribute names; this is a style preference, not a spec requirement. | ||||||||||||
| Consistent tag name casing | HTML permits any mix of ASCII upper/lower case in tag names; this is a style preference, not a spec requirement. | ||||||||||||
| No duplicate attr | The parser ignores all such duplicate occurrences of the attribute. | ||||||||||||
| No obsolete attr | Authors must not use attributes the spec has removed entirely. The group name is kept as deprecated-attr for backward compatibility. |
||||||||||||
| No deprecated attr | MDN/BCD-sourced (factual, not a spec MUST) — kept enabled here (severity downgraded to warning, not removed from the preset) so existing markuplint:html-standard users keep this coverage. | ||||||||||||
| No obsolete element | Authors must not use elements the spec has removed entirely. The group name is kept as deprecated-element for backward compatibility. |
||||||||||||
| No deprecated element | MDN/BCD-sourced (factual, not a spec MUST) — kept enabled here (severity downgraded to warning, not removed from the preset) so existing markuplint:html-standard users keep this coverage. | ||||||||||||
Require doctype |
It has the effect of avoiding quirks mode. The group name is kept as doctype for backward compatibility. |
||||||||||||
| No obsolete doctype | Authors must not use an obsolete DOCTYPE (a public identifier, or a system identifier other than the one legacy-string exception the spec still permits). | ||||||||||||
| Must not skip heading levels | |||||||||||||
| No duplicate autofocus | There must not be two elements with the autofocus attribute specified in the same document. | ||||||||||||
| No duplicate visible main | There must not be more than one visible main element in a document. | ||||||||||||
| No invalid attr | Each element's attribute names and values must conform to the HTML specification. | ||||||||||||
| No use orphaned end tag | |||||||||||||
| No stray head or body tag | |||||||||||||
| No content after body | |||||||||||||
| No unclosed element at EOF | |||||||||||||
| Meta charset position within the first 1024 bytes | |||||||||||||
| Allow only permitted contents | |||||||||||||
| No disallowed ancestor | An element must not appear as a descendant of an ancestor its content model forbids (e.g. <address> inside <address>). Split off from permitted-contents — kept as its own named group here so preset users keep this coverage. |
||||||||||||
| Require ancestor | An element must appear as a descendant of a required ancestor (e.g. <area> outside <map>). Split off from permitted-contents — kept as its own named group here so preset users keep this coverage. |
||||||||||||
| No duplicate sibling attr | An attribute the content model marks as sibling-unique must not appear on more than one element of the same type within the same parent (e.g. multiple <track default>). Split off from permitted-contents — kept as its own named group here so preset users keep this coverage. |
||||||||||||
| Need placeholder label option | |||||||||||||
Require the datetime attribute if the content of the time element is invalid |
|||||||||||||
| Specify required attr | |||||||||||||
Validate <script type="importmap"> body against the import map spec |
Split from the former script-content rule (#3989). This group keeps its name — and wraps only this one rule, so a group with 2+ rules doesn't get its virtual rule name suffixed with the base rule name — for anyone overriding it directly. valid-speculation-rules lives in its own sibling group below for the same reason. |
||||||||||||
Validate <script type="speculationrules"> body against the Speculation Rules spec |
|||||||||||||
Require sizes wherever srcset uses width descriptors, and vice versa |
Split from the former srcset-sizes-constraint rule (#3989). This group keeps its name — and wraps only this one rule, so a group with 2+ rules doesn't get its virtual rule name suffixed with the base rule name — for anyone overriding it directly. The other three checks live in their own sibling groups below for the same reason. |
||||||||||||
Disallow mixing width and pixel density descriptors in srcset |
|||||||||||||
Require loading="lazy" wherever sizes="auto" is used |
|||||||||||||
Require a distinguishing media or type on a <source> with a following srcset-bearing sibling |
|||||||||||||
| Validate link type keywords | Validates that rel attribute keywords are allowed on the given element and context (e.g., body-ok for <link> inside <body>). |
||||||||||||
Form-associated form attribute must reference a form element |
|||||||||||||
<input list> must reference a <datalist> element by ID |
|||||||||||||
<label for> must reference a labelable element by ID |
|||||||||||||
<label> descendant-control constraints (at most one form-control descendant; none when for targets an external labelable element) |
|||||||||||||
<map> id must equal name when both are specified |
|||||||||||||
<img usemap> must be a valid hash-name reference to a <map> element |
|||||||||||||
<meter> attribute inequalities (min ≤ value ≤ max etc.) |
|||||||||||||
<progress> attribute inequalities (value ≤ max; value ≤ 1 when max is absent) |
|||||||||||||
Single <select> allows at most one selected <option> |
|||||||||||||
Every itemprop belongs to an itemscoped item |
|||||||||||||
Specify charset=UTF-8 |
|||||||||||||
| No duplicate meta charset | There must not be more than one meta element with a charset attribute per document. | ||||||||||||
| No duplicate meta description | There must not be more than one meta element where the name attribute value is an ASCII case-insensitive match for "description" per document. | ||||||||||||
| No coexistence of meta charset and meta http-equiv content-type | A document must not contain both a meta element with an http-equiv attribute in the Encoding declaration state and a meta element with the charset attribute. | ||||||||||||
<base> must precede <link> and <script> |
A base element must come before any other elements in the tree that have attributes defined as taking URLs, except the html element. In <head>, the URL-taking elements are <link> (href, imagesrcset) and <script> (src); a <base> that follows either shadows its own effect on those references. |
||||||||||||
No use <small> as subheadings |
The small element must not be used for subheadings. | ||||||||||||
No use <caption> within <figure> |
When <table> is the only content in <figure> other than <figcaption>, <caption> should be omitted in favor of <figcaption>. |
||||||||||||
Require title attr in <input pattern> |
When an <input> element has a pattern attribute specified, authors should include a title attribute to give a description of the pattern. |
||||||||||||
No nested same <details> name group |
A document must not contain a details element that is a descendant of another details element in the same details name group. | ||||||||||||
No use shortcut keyword in <link rel> |
For historical reasons, the icon keyword may be preceded by the keyword "shortcut". However, pages should not use the keyword "shortcut" as it is unnecessary. | ||||||||||||
Require conventional <head> element order |
A consistent order (charset, viewport, title, then the rest) lets the browser start rendering sooner instead of re-parsing metadata. | ||||||||||||
| Require matching aspect-ratio attributes | width/height that mismatch the image's actual aspect ratio still cause a layout shift once the image loads, defeating the point of setting them. |
||||||||||||
Require charset=UTF-8 |
|||||||||||||
Require defer attr |
Should load and parse scripts lazily to avoid render-blocking. | ||||||||||||
| Require aspect-ratio | Require width and height attr with <img> to avoid Cumulative Layout Shift |
||||||||||||
Require loading <iframe> lazily |
Require loading=lazy with <iframe> to avoid render-blocking that causes loading if its element is out of the viewport. |
||||||||||||
Allow property attr with <meta> |
Be able to use Open-Graph etc. | ||||||||||||
| No hard coding ID | The component that hard-coded ID cannot mount to an app duplicated because the IDs must be unique in a document. Recommend to specify dynamic IDs to avoid doing that. | ||||||||||||
| Use no-unescaped-char | Warns when a literal < (the one character HTML LS always prohibits unescaped) appears in a text node or attribute value. The group name is kept as character-reference for backward compatibility. |
||||||||||||
| Use no-malformed-character-reference | Warns when a &...;-shaped character reference is malformed (unknown name, missing semicolon, or a NULL/surrogate/control/ noncharacter/out-of-range numeric reference). |
||||||||||||
| No omit end-tag | Recommend to write an end-tag always because it is too difficult for a human decide an element is end-tag omittable. | ||||||||||||
| Disallow inline event handler attributes | Inline event handlers (onclick, onerror, etc.) execute arbitrary script from markup, which is a common XSS injection vector. |
Install
markuplint package includes this package.
If you are installing purposely, how below:
$ npm install @markuplint/config-presets
$ yarn add @markuplint/config-presets