Skip to content

Latest commit

 

History

History
118 lines (90 loc) · 3.11 KB

html-self-closing.md

File metadata and controls

118 lines (90 loc) · 3.11 KB
pageClass sidebarDepth title description since
rule-details
0
svelte/html-self-closing
enforce self-closing style
v2.5.0

svelte/html-self-closing

enforce self-closing style

  • 🔧 The --fix option on the command line can automatically fix some of the problems reported by this rule.

📖 Rule Details

You can choose either two styles for elements without content.

  • always: <SomeComponent />
  • never: <SomeComponent></SomeComponent>
<script>
  /* eslint svelte/html-self-closing: "error" */
</script>

<!-- ✓ GOOD -->
<p>Hello</p>
<div></div>
<img />
<svelte:head />
<svg><path /></svg>
<math><msup></msup></math>
<SomeComponent />

<!-- ✗ BAD -->
<div />
<div><div /></div>
<svelte:body></svelte:body>
<svg><path></path></svg>
<math><msup /></math>
<SomeComponent></SomeComponent>

🔧 Options

presets:

{
  "svelte/html-self-closing": [
    "error",
    "default" // or "all" or "html" or "none"
  ]
}

config object:

{
  "svelte/html-self-closing": [
    "error",
    {
      "void": "always", // or "never" or "ignore"
      "normal": "never", // or "always" or "ignore"
      "svg": "always", // or "never" or "ignore"
      "never": "never", // or "always" or "ignore"
      "component": "always", // or "never" or "ignore"
      "svelte": "always" // or "never" or "ignore"
    }
  ]
}

presets:

  • default - MathML and non-void HTML elements should have a closing tag; otherwise, they should be self-closing.
  • all - all elements should be self-closing (unless they have children)
  • html - html-compliant - only void elements and svelte special elements should be self-closing
  • none - no elements should be self-closing

::: warning Note We recommend selecting default as the preset. Choosing any other option may result in settings that are inconsistent with the compiler when using Svelte5. :::

config object:

  • void ("always" in default preset)... Style of HTML void elements
  • normal ("never" in default preset)... Style of other elements
  • svg ("always" in default preset)... Style of SVG
  • math (never in default preset)... Style of MathML
  • component ("always" in default preset)... Style of svelte components
  • svelte ("always" in default preset)... Style of svelte special elements (<svelte:head>, <svelte:self>)

::: warning foreign is removed in eslint-plugin-svelte v3. :::

Every config object option can be set to

  • "always" (<SomeComponent />)
  • "never" (<SomeComponent></SomeComponent>)
  • "ignore" (either <SomeComponent /> or <SomeComponent></SomeComponent>)

🚀 Version

This rule was introduced in eslint-plugin-svelte v2.5.0

🔍 Implementation