Disable Biome Unused Variable Warnings in Astro/Vue/Svelte Files

In framework files such as Astro, Vue, and Svelte, variables or imports used in the template can look unused from the JavaScript side.

Biome warns about them as unused variables or unused imports, but they are actually used in the template, so this is a false positive.

Fix

In the Biome config file, you can disable unused warnings for specific file types.

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

Only for the file types specified in includes, the noUnusedImports and noUnusedVariables rules are turned off.

Customization

If your project does not use one of these frameworks, just remove it from includes.

For example, if you only use Astro, specifying only "**/*.astro" is enough.

If you need to support other frameworks, add them to the array.

Summary

With Biome’s overrides feature, it is easy to avoid false positives caused by framework-specific syntax.

Adjusting rules for each framework makes the lint setup much more practical.