Biomeの未使用変数警告をAstro/Vue/Svelteファイルで無効化する

Astro、Vue、Svelteなどのフレームワークファイルでは、テンプレート部分で使っている変数やインポートがJavaScript部分では未使用に見えることがある。

Biomeはこれを未使用変数・未使用インポートとして警告するが、実際にはテンプレートで使われているため誤検知だ。

解決方法

Biomeの設定ファイルで、特定のファイルタイプに対して未使用警告を無効化できる。

{
  "overrides": [
    {
      "includes": ["**/*.astro", "**/*.vue", "**/*.svelte"],
      "linter": {
        "rules": {
          "correctness": {
            "noUnusedImports": "off",
            "noUnusedVariables": "off"
          }
        }
      }
    }
  ]
}

includesで指定したファイルタイプに対してのみ、noUnusedImportsとnoUnusedVariablesのルールをオフにする。

カスタマイズ

プロジェクトで使っていないフレームワークはincludesから除外すればよい。

たとえばAstroだけを使っている場合は、"**/*.astro"だけを指定する。

逆に他のフレームワークも追加したい場合は、配列に追加していけばよい。

まとめ

Biomeのoverrides機能を使えば、フレームワーク特有の構文による誤検知を簡単に回避できる。

フレームワークごとに適切なルール調整を行うことで、より実用的なリント環境が整う。