インラインディレクティブでのリンティングルールの抑制

Axe DevTools Linterは、コメントディレクティブをサポートしており、ソースファイル内でリンティングルールを抑制または再有効化することができます。これは、既知の違反が含まれていて、それを認識しながらもリンティングから除外したい場合に役立ちます。この場合、グローバルaxe-linter.yml設定を変更する必要はありません。

ディレクティブはブロックコメント（/* ... */）、行コメント（// ...）、HTMLコメント（<!-- ... -->）で機能し、Axe DevTools Linterが処理する全てのファイルタイプでサポートされています。

特定のルールを抑制するには、ディレクティブの後にルール名を含めます。すべてのルールを抑制するには、ルール名を省略します。

ディレクティブ

axe-linter-disable

ディレクティブのポイントからファイルの終わりまで、または一致するaxe-linter-enableディレクティブに遭遇するまで、1つまたは複数のルールを無効にします。

<!-- axe-linter-disable image-alt -->
<img src="logo.png" />
<!-- axe-linter-enable image-alt -->
<img src="other.png" />

すべてのルールを（1つだけではなく）無効にするには、ルール名を省略します：

<!-- axe-linter-disable -->
<img src="logo.png" />
<a href="#"></a>
<!-- axe-linter-enable -->

axe-linter-enable

以前axe-linter-disableディレクティブによって無効化された1つまたは複数のルールを再有効化します。このディレクティブの後に現れるコードについて、ルールは再びチェックされます。

<!-- axe-linter-disable image-alt -->
<img src="uncaptioned.png" />
<!-- axe-linter-enable image-alt -->
<img src="must-have-alt.png" />

axe-linter-disable-next-line

ディレクティブの直後に続く1行のみで、1つまたは複数のルールを無効にします。

<!-- axe-linter-disable-next-line image-alt -->
<img src="logo.png" />

axe-linter-disable-line

ディレクティブが記載されている行で、1つまたは複数のルールを無効にします。

<img src="logo.png" /> <!-- axe-linter-disable-line image-alt -->

関連情報

• 設定ファイルのオプション（ルールをグローバルに無効化することを含む）については、Axe DevTools Linterの設定を参照してください。
• ルールの全一覧については、アクセシビリティルールを参照してください。