Skip to content

Files

Latest commit

 

History

History
82 lines (61 loc) · 1.54 KB

no-restricted-html-elements.md

File metadata and controls

82 lines (61 loc) · 1.54 KB

Pattern: Use of restricted HTML element

Issue: -

Description

This rule reports to usage of restricted HTML elements.

<script>
  /* eslint svelte/no-restricted-html-elements: ["error", "h1", "h2", "h3", "h4", "h5", "h6"] */
</script>

<!-- ✓ GOOD -->
<div>
  <p>Hi!</p>
</div>

<!-- ✗ BAD -->
<h1>foo</h1>

<div>
  <h2>bar</h2>
</div>

<script>
  /* eslint svelte/no-restricted-html-elements: ["error", { "elements": ["marquee"], "message": "Do not use deprecated HTML tags" }] */
</script>

<!-- ✓ GOOD -->
<div>
  <p>Hi!</p>
</div>

<!-- ✗ BAD -->
<marquee>foo</marquee>

<div>
  <marquee>bar</marquee>
</div>

🔧 Options

This rule takes a list of strings, where each string is an HTML element name to be restricted:

{
  "svelte/no-restricted-html-elements": ["error", "h1", "h2", "h3", "h4", "h5", "h6"]
}

Alternatively, the rule also accepts objects.

{
  "svelte/no-restricted-html-elements": [
    "error",
    {
      "elements": ["h1", "h2", "h3", "h4", "h5", "h6"],
      "message": "Prefer use of our custom <Heading /> component"
    },
    {
      "elements": ["marquee"],
      "message": "Do not use deprecated HTML tags"
    }
  ]
}

🚀 Version

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

🔍 Implementation