# svelte/comment-directive

support comment-directives in HTML template

  • ⚙️ This rule is included in "plugin:svelte/base" and "plugin:svelte/recommended".

Sole purpose of this rule is to provide eslint-disable functionality in the template HTML. It supports usage of the following comments:

  • eslint-disable
  • eslint-enable
  • eslint-disable-line
  • eslint-disable-next-line

Note

We can’t write HTML comments in tags.

# 📖 Rule Details

ESLint doesn’t provide any API to enhance eslint-disable functionality and ESLint rules cannot affect other rules. But ESLint provides processors API.

This rule sends all eslint-disable-like comments to the post-process of the .svelte file processor, then the post-process removes the reported errors in disabled areas.

<script>  /* eslint svelte/comment-directive: "error", no-undef: "error" */ </script>  <!-- eslint-disable-next-line no-undef --> <UndefComponent />

The eslint-disable-like comments can include descriptions to explain why the comment is necessary. The description must occur after the directive and is separated from the directive by two or more consecutive - characters. For example:

<script>  /* eslint svelte/comment-directive: "error", no-undef: "error" */ </script>  <!-- eslint-disable-next-line no-undef -- Here's a description about why this disabling is necessary. --> <UndefComponent />

# 🔧 Options

{  "svelte/comment-directive": [  "error",  {  "reportUnusedDisableDirectives": false  }  ] }
  • reportUnusedDisableDirectives … If true, to report unused eslint-disable HTML comments. default false

# { "reportUnusedDisableDirectives": true }

<script>  /* eslint svelte/comment-directive: ["error", { "reportUnusedDisableDirectives": true }], no-undef: "error" */  import DefinedComponent from './DefinedComponent.svelte'; </script>  <!-- ✓ GOOD --> <!-- eslint-disable-next-line no-undef --> <UndefComponent />  <!-- ✗ BAD --> <!-- eslint-disable-next-line 
Unused eslint-disable-next-line directive (no problems were reported from 'no-undef'). (svelte/comment-directive)
no-undef --> <DefinedComponent />

# 📚 Further Reading

# 🚀 Version

This rule was introduced in eslint-plugin-svelte v0.0.13

# 🔍 Implementation