Svelte：禁用 ESLint 规则

Question

我正在开发一个使用 ESlint 的 Svelt 项目，我试图禁用我的 svelte 模板中的规则，但找不到任何有关如何执行此操作的信息。我的代码如下：

<script lang="ts">
  const unsubscribe = promiseWritable.subscribe((value) => {
    promise = value;
  });

  onDestroy(unsubscribe);
</script>

{#if !!promise} <---- ESLint error here!
  {#await promise then promiseResult}
    <Info {promiseResult} />
  {/await}
{/if}

这会导致{#if !!promise}出现 ESLint 错误：

Expected non-Promise value in a boolean conditional.eslint@typescript-eslint/no-misused-promises)

无论我是否应该禁用此规则，我都想知道如何在文件中禁用它，因为在该行上方添加： // eslint-disable-next-line...或<!-- eslint-disable-next-line... --> 不会禁用该错误。

作为参考，我正在使用https://github.com/sveltejs/eslint-plugin-svelte3

Answer 1

自此提交以来，您现在可以向 Svelte 文件添加“神奇注释”，以禁用使用表单的单独验证<!-- svelte-ignore rule-name -->。

<!-- svelte-ignore a11y-mouse-events-have-key-events -->
<div on:mouseover={mouseOver} on:mouseleave={mouseLeave} class="wrapper">
  <slot name="content" />
</div>

Answer 2

我发现了一个不太令人满意的解决方案，添加/* eslint-disable */到脚本标签的底部，给我们：

<script lang="ts">
  const unsubscribe = promiseWritable.subscribe((value) => {
    promise = value;
  });

  onDestroy(unsubscribe);
  /* eslint-disable */
</script>

{#if !!promise} <---- No ESLint error anymore
  {#await promise then promiseResult}
    <Info {promiseResult} />
  {/await}
{/if}

这将禁用 HTML 模板中的所有 linting。