no-extra-spacing-attrs

This rule disallows extra spaces around attributes, and/or between the tag start and end

How to use

.eslintrc.js
module.exports = {
  rules: {
    "@html-eslint/no-extra-spacing-attrs": "error",
  },
};

Rule Details

Examples of incorrect code for this rule:

<!-- an extra space between attributes -->
<div foo="foo"  bar="bar"></div>

<!-- an extra space between tag start and attribute -->
<div  foo="foo"></div>

<!-- an extra space between tag end and attribute -->
<div foo="foo" ></div>

<!-- an extra space between tag start and end -->
<div ></div>

Examples of correct code for this rule:

<div foo="foo" bar="bar"></div>
<div foo="foo"></div>
<div></div>

Options

  1. enforceBeforeSelfClose (default: false): enforce one space before self closing (/>)

Examples of incorrect code for this rule with the default { "enforceBeforeSelfClose": true } option:

<img src="foo.png"  />

<img src="foo.png"/>

Examples of correct code for this rule with the default { "enforceBeforeSelfClose": true } option:

<img src="foo.png" />
  1. disallowMissing (default: false): Enforce at least one space between attributes

Example(s) of incorrect code for this rule with the { "disallowMissing": true } option:

<div id="foo"class="bar">
</div>

Example(s) of correct code for this rule with the { "disallowMissing": true } option:

<div id="foo" class="bar">
</div>
  1. disallowTabs (default: false): Enforce using spaces instead of tabs between attributes

Example(s) of incorrect code for this rule with the { "disallowTabs": true } option:

<div	id="foo"	class="bar">
</div>

Example(s) of correct code for this rule with the { "disallowTabs": true } option:

<div id="foo" class="bar">
</div>
  1. disallowInAssignment (default: false): Disallows spaces around the attribute assignment operator =

Example(s) of incorrect code for this rule with the { "disallowInAssignment": true } option:

<div id = "foo" class = "bar">
</div>

Example(s) of correct code for this rule with the { "disallowInAssignment": true } option:

<div id="foo" class="bar">
</div>