🔧

VSCodeでbiomeのunsafeエラーを自動修正する

2024/12/27に公開

背景

最近Prettier + ESLintからBiomeへの乗り換えをお試し中です。
TailwindCSSクラスの自動ソートはprettier-plugin-tailwindcssbiomeのuseSortedClassesで代替することになったんですが、VSCodeで自動修正されないのがストレスでした。

なぜ自動修正されないのか

useSortedClassesルールは unsafe に分類されるため、デフォルトでは自動修正の対象となりません。

解決方法

Biome 1.8 からルールの自動修正方法を設定できるようになっています。

configure-the-rule-fix

useSortedClassesだと以下のように設定することで自動修正が有効になります。
optionsはJSONスキーマに怒られるのでつけているだけです)

biome.json
<   "useSortedClasses": "error"
---
>   "useSortedClasses": {
>      "level": "error",
>      "fix": "safe",
>      "options": {}
>    }

逆に safe なルールでも自動修正を無効にすることもできます。

biome.json
    "noBlankTarget": {
      "level": "error",
      "fix": "unsafe",
      "options": {}
    }

Discussion