Перейти к содержимому
Biome
Документация Организациям Песочница
Blog

Журнал изменений

2.3.0 Latest

Minor Changes

  • #7263 a3e3369 Thanks @arendjr! - Biome’s resolver now supports baseUrl if specified in tsconfig.json.

    Example

    Given the following file structure:

    tsconfig.json

    {
      "compilerOptions": {
        "baseUrl": "./src"
      }
    }

    src/foo.ts

    export function foo() {}

    In this scenario, import { foo } from "foo"; should work regardless of the location of the file containing the import statement.

    Fixes #6432.

  • #7745 6fcbc07 Thanks @dyc3! - Added ignore option to noUnknownAtRules. If an unknown at-rule matches any of the items provided in ignore, a diagnostic won’t be emitted.

  • #7753 63cb7ff Thanks @ematipico! - Enhanced the init command. The init command now checks if the existing project contains known ignore files and known generated folders.

    If Biome finds .gitignore or .ignore files, it will add the following configuration to biome.json:

    {
      "vcs": {
        "enabled": true,
        "clientKind": "git",
        "useIgnoreFile": true
      }
    }

    If Biome finds a dist/ folder, it will exclude it automatically using the double-exclude syntax:

    {
      "files": {
        "includes": ["**", "!!**/dist"]
      }
    }

  • #7548 85d3a3a Thanks @siketyan! - The rules in a domain are no longer enabled automatically by the installed dependencies unless the rule is recommended.

  • #7723 d3aac63 Thanks @ematipico! - Added --css-parse-css-modules CLI flag to control whether CSS Modules syntax is enabled.

    You can now enable or disable CSS Modules parsing directly from the command line:

    Terminal window
    biome check --css-parse-css-modules=true file.module.css
    biome format --css-parse-css-modules=true file.module.css
    biome lint --css-parse-css-modules=true file.module.css
    biome ci --css-parse-css-modules=true file.module.css

  • #7723 d3aac63 Thanks @ematipico! - Added --css-parse-tailwind-directives CLI flag to control whether Tailwind CSS 4.0 directives and functions are enabled.

    You can now enable or disable Tailwind CSS 4.0 directive parsing directly from the command line:

    Terminal window
    biome check --css-parse-tailwind-directives=true file.css
    biome format --css-parse-tailwind-directives=true file.css
    biome lint --css-parse-tailwind-directives=true file.css
    biome ci --css-parse-tailwind-directives=true file.css

  • #7330 272632f Thanks @ematipico! - Updated the formatting of .svelte and .vue files. Now the indentation of the JavaScript blocks matches Prettier’s:

    <script>
     import Component from "./Component"
       import Component from "./Component"
    </script>

  • #7333 de0d2d6 Thanks @dyc3! - Implemented the indentScriptAndStyle option for vue and svelte files, with the default set to false to match Prettier’s vueIndentScriptAndStyle option. When enabled, this option indents the content within <script> and <style> tags to align with the surrounding HTML structure.

    It can be enabled with this configuration:

    {
      "html": {
        "formatter": {
          "indentScriptAndStyle": true
        }
      }
    }

    Which will format this code to:

    <script>
    import Component from "./Component.vue";
    </script>

  • #7359 ebbddc4 Thanks @arendjr! - Deprecated the option files.experimentalScannerIgnores in favour of force-ignore syntax in files.includes.

    files.includes supports ignoring files by prefixing globs with an exclamation mark (!). With this change, it also supports force-ignoring globs by prefixing them with a double exclamation mark (!!).

    The effect of force-ignoring is that the scanner will not index files matching the glob, even in project mode, even if those files are imported by other files, and even if they are files that receive special treatment by Biome, such as nested biome.json files.

    Example

    Let’s take the following configuration:

    {
      "files": {
        "includes": [
          "**",
          "!**/generated",
          "!!**/dist",
          "fixtures/example/dist/*.js"
        ]
      },
      "linter": {
        "domains": {
          "project": "all"
        }
      }
    }

    This configuration achieves the following:

    • Because the project domain is enabled, all supported files in the project are indexed and processed by the linter, except:
    • Files inside a generated folder are not processed by the linter, but they will get indexed if a file outside a generated folder imports them.
    • Files inside a dist folder are never indexed nor processed, not even if they are imported for any purpose, except:
    • When the dist folder is inside fixtures/example/, its .js files do get both indexed and processed.

    In general, we now recommend using the force-ignore syntax for any folders that contain output files, such as build/ and dist/. For such folders, it is highly unlikely that indexing has any useful benefits. For folders containing generated files, you may wish to use the regular ignore syntax so that type information can still be extracted from the files.

    experimentalScannerIgnores will continue to work for now, but you’ll see a deprecation warning if you still use it.

    Run the biome migrate --write command to automatically update the configuration file.

  • #7698 3b6f5e3 Thanks @ematipico! - Added a new reporter named rdjson. This reporter prints diagnostics following the RDJSON format:

    The following command:

    Terminal window
    biome check --reporter=rdjson

    Will emit diagnostics in the following format:

    {
      "source": {
        "name": "Biome",
        "url": "https://biomejs.dev"
      },
      "diagnostics": [
        {
          "code": {
            "url": "https://biomejs.dev/linter/rules/no-unused-imports",
            "value": "lint/correctness/noUnusedImports"
          },
          "location": {
            "path": "index.ts",
            "range": {
              "end": {
                "column": 11,
                "line": 0
              },
              "start": {
                "column": 7,
                "line": 0
              }
            }
          },
          "message": "This import is unused."
        },
        {
          "code": {
            "url": "https://biomejs.dev/linter/rules/no-unused-imports",
            "value": "lint/correctness/noUnusedImports"
          },
          "location": {
            "path": "index.ts",
            "range": {
              "end": {
                "column": 10,
                "line": 1
              },
              "start": {
                "column": 9,
                "line": 1
              }
            }
          },
          "message": "Several of these imports are unused."
        }
      ]
    }

  • #7719 188a767 Thanks @cadunass! - The formatWithErrors option can now be set via CLI using the --format-with-errors flag.

    This flag was previously only available in the configuration file. It allows formatting to proceed on files with syntax errors, which is useful during development when you want to auto-format code while fixing syntax issues.

    Example

    Terminal window
    biome format --format-with-errors=true --write file.js

  • #7723 d3aac63 Thanks @ematipico! - Added --json-parse-allow-comments CLI flag to control whether comments are allowed in JSON files.

    You can now enable or disable comment parsing in JSON files directly from the command line:

    Terminal window
    biome check --json-parse-allow-comments=true file.json
    biome format --json-parse-allow-comments=true file.json
    biome lint --json-parse-allow-comments=true file.json
    biome ci --json-parse-allow-comments=true file.json

  • #7723 d3aac63 Thanks @ematipico! - Added --json-parse-allow-trailing-commas CLI flag to control whether trailing commas are allowed in JSON files.

    You can now enable or disable trailing comma parsing in JSON files directly from the command line:

    Terminal window
    biome check --json-parse-allow-trailing-commas=true file.json
    biome format --json-parse-allow-trailing-commas=true file.json
    biome lint --json-parse-allow-trailing-commas=true file.json
    biome ci --json-parse-allow-trailing-commas=true file.json

  • #7758 cea002f Thanks @ematipico! - Promoted new lint rules:

    • Promoted noNonNullAssertedOptionalChain to the suspicious group
    • Promoted useReactFunctionComponents to the style group
    • Promoted useImageSize to the correctness group
    • Promoted useConsistentTypeDefinitions to the style group
    • Promoted useQwikClasslist to the correctness group
    • Promoted noSecrets to the security group

    Removed the lint rule useAnchorHref, because its use case is covered by useValidAnchor.

  • #6356 296627d Thanks @wrick17! - Added the new checkstyle reporter. When --reporter=checkstyle is passed to the CLI, Biome will emit diagnostics for Checkstyle format:

    <?xml version="1.0" encoding="utf-8"?>
    <checkstyle version="4.3">
      <file name="index.ts">
        <error line="1" column="8" severity="warning" message="This import is unused." source="lint/correctness/noUnusedImports" />
        <error line="2" column="10" severity="warning" message="Several of these imports are unused." source="lint/correctness/noUnusedImports" />
        <error line="8" column="5" severity="warning" message="This variable f is unused." source="lint/correctness/noUnusedVariables" />
        <error line="9" column="7" severity="warning" message="This variable f is unused." source="lint/correctness/noUnusedVariables" />
        <error line="1" column="1" severity="error" message="The imports and exports are not sorted." source="assist/source/organizeImports" />
        <error line="4" column="3" severity="error" message="Using == may be unsafe if you are relying on type coercion." source="lint/suspicious/noDoubleEquals" />
        <error line="6" column="1" severity="error" message="This is an unexpected use of the debugger statement." source="lint/suspicious/noDebugger" />
        <error line="8" column="5" severity="error" message="This variable implicitly has the any type." source="lint/suspicious/noImplicitAnyLet" />
        <error line="9" column="7" severity="error" message="This variable implicitly has the any type." source="lint/suspicious/noImplicitAnyLet" />
        <error line="2" column="10" severity="error" message="Shouldn&apos;t redeclare &apos;z&apos;. Consider to delete it or rename it." source="lint/suspicious/noRedeclare" />
        <error line="9" column="7" severity="error" message="Shouldn&apos;t redeclare &apos;f&apos;. Consider to delete it or rename it." source="lint/suspicious/noRedeclare" />
        <error line="0" column="0" severity="error" message="Formatter would have printed the following content:" source="format" />
      </file>
      <file name="main.ts">
        <error line="1" column="8" severity="warning" message="This import is unused." source="lint/correctness/noUnusedImports" />
        <error line="2" column="10" severity="warning" message="Several of these imports are unused." source="lint/correctness/noUnusedImports" />
        <error line="8" column="5" severity="warning" message="This variable f is unused." source="lint/correctness/noUnusedVariables" />
        <error line="9" column="7" severity="warning" message="This variable f is unused." source="lint/correctness/noUnusedVariables" />
        <error line="1" column="1" severity="error" message="The imports and exports are not sorted." source="assist/source/organizeImports" />
        <error line="4" column="3" severity="error" message="Using == may be unsafe if you are relying on type coercion." source="lint/suspicious/noDoubleEquals" />
        <error line="6" column="1" severity="error" message="This is an unexpected use of the debugger statement." source="lint/suspicious/noDebugger" />
        <error line="8" column="5" severity="error" message="This variable implicitly has the any type." source="lint/suspicious/noImplicitAnyLet" />
        <error line="9" column="7" severity="error" message="This variable implicitly has the any type." source="lint/suspicious/noImplicitAnyLet" />
        <error line="2" column="10" severity="error" message="Shouldn&apos;t redeclare &apos;z&apos;. Consider to delete it or rename it." source="lint/suspicious/noRedeclare" />
        <error line="9" column="7" severity="error" message="Shouldn&apos;t redeclare &apos;f&apos;. Consider to delete it or rename it." source="lint/suspicious/noRedeclare" />
        <error line="0" column="0" severity="error" message="Formatter would have printed the following content:" source="format" />
      </file>
    </checkstyle>

  • #7488 b13e524 Thanks @kpapa05! - Added “@rbxts/react” as an alias for “react” for handling the reactClassic jsxRuntime.

  • #7536 0bccd34 Thanks @TheAlexLichter! - Added .oxlintrc.json to well-known files.

  • #7548 85d3a3a Thanks @siketyan! - The following rules are now a part of the react domain, and they won’t be enabled automatically unless you enabled the domain, or Biome detects react as a dependency of your closest package.json:

  • #7667 480909a Thanks @ematipico! - Added the ability to show severity Information diagnostics in reporter outputs.

    If one or more rules are triggered, and they are configured to emit an Information diagnostic, now they’re counted in the final output:

    Terminal window
    Checked 1 file in <TIME>. No fixes applied.
    Found 1 info.

  • #7702 28e8860 Thanks @ematipico! - Added linting and assist support for .html files, with addition of two new configurations:

    • html.linter.enabled
    • html.assist.enabled

    The HTML linter, in this release, only contains the rule noHeaderScope. More rules will be released in the upcoming releases.

  • #7164 f66b0c5 Thanks @dyc3! - Added a new CSS parser option tailwindDirectives. Enabling this option will allow all of Tailwind v4’s syntax additions to be parsed and formatted by Biome.

    You can enable this by setting css.parser.tailwindDirectives to true in your Biome configuration.

    {
      "css": {
        "parser": {
          "tailwindDirectives": true
        }
      }
    }

  • #7669 6ed4d16 Thanks @barklund! - React 19.2 support is now supported in Biome:

  • #7702 28e8860 Thanks @ematipico! - Added experimental full support for HTML, Vue, Svelte and Astro files. In this release, the HTML parser has been enhanced, and it’s now able to parse .vue, .svelte and .astro files.

    This means that now Biome is able to lint and format the JavaScript (TypeScript), HTML and CSS code that is contained in these files.

    Now that the main architecture is stable and working, in the upcoming patches and minors we will also fix possible inaccuracies and edge cases coming from existing lint rules, such as noUnusedVariables inside <script> blocks or frontmatter.

    The support is considered experimental because there might be cases that aren’t fine-parsed yet, hence causing possible inaccuracies when it comes to formatting and linting.

  • #7599 09445c8 Thanks @anaisbetts! - #### lineEnding has a new option auto

    The option lineEnding now has a variant called auto to match the operating system’s expected line-ending style: on Windows, this will be CRLF (\r\n), and on macOS / Linux, this will be LF (\n).

    This allows for cross-platform projects that use Biome not to have to force one option or the other, which aligns better with Git’s default behavior on these platforms.

    Example usage:

    {
      "formatter": {
        "lineEnding": "auto"
      }
    }
    Terminal window
    biome format --line-ending auto

  • #7392 e4feb8e Thanks @ematipico! - Added new capabilities to the CLI arguments --skip and --only, available to the biome lint command.

    --skip and --only can now accept domain names; when provided, Biome will run or skip all the rules that belong to a certain domain.

    For example, the following command will only run the rules that belong to the next domain:

    Terminal window
    biome lint --only=next

    Another example, the following command will skip the rules that belong to the project domain:

    Terminal window
    biome lint --skip=project

  • #7702 28e8860 Thanks @ematipico! - Added a new option called html.interpolation. This option enables the parsing of text expressions (or interpolation) in HTML files.

    The following file.html will be correctly formatted:

    file.html
    <div>
      Hello {{ name }}!
      <p>Your balance is: {{ account.balance }}</p>
      <button>{{ isLoading ? "Loading..." : "Submit" }}</button>
    </div>

    To note that html.interpolation only parses text expressions that are delimited by double curly braces ({{ }}). The content of expressions is parsed as normal text.

Patch Changes

  • #7712 fcc9b42 Thanks @minht11! - Added new rule useVueDefineMacrosOrder which allows enforcing specific order for Vue compiler macros.

    In this example, the rule will suggest moving defineProps before defineEmits:

    <script lang="ts" setup>
    const emit = defineEmits(["update"]);
    const props = defineProps<{ name: string }>();
    </script>

  • #7698 3b6f5e3 Thanks @ematipico! - Fixed an issue where the JUnit reporter returned a zero-based location. Now the location returned is one-based.

  • #7819 ef45056 Thanks @ematipico! - Fixed #7788. Removes some error logging that were emitted when loading possible configuration files.

  • #7593 e51dd55 Thanks @arendjr! - Fixed an issue with the files.maxSize setting. Previously the setting would always be looked up in the root settings, even in monorepos where a closer biome.json is available. It now correctly uses the nearest configuration.

  • #7825 ad55b35 Thanks @Conaclos! - Fixed #7798. useNamingConvention no longer panics when it encounters a name that consists of a single dollar sign $ that doesn’t match a custom convention.

  • #7764 93be2ab Thanks @gaauwe! - Fixed #6589: Biome now properly loads extension settings before loading the configuration file when opening a text document in the LSP server.

2.2.7

Patch Changes

2.2.6

Patch Changes

  • #7071 a8e7301 Thanks @ptkagori! - Added the useQwikMethodUsage lint rule for the Qwik domain.

    This rule validates Qwik hook usage. Identifiers matching useXxx must be called only within serialisable reactive contexts (for example, inside component$, route loaders/actions, or within other Qwik hooks), preventing common Qwik antipatterns.

    Invalid:

    // Top-level hook call is invalid.
    const state = useStore({ count: 0 });
    

    function helper() {
      // Calling a hook in a non-reactive function is invalid.
      const loc = useLocation();
    }

    Valid:

    component$(() => {
      const state = useStore({ count: 0 }); // OK inside component$.
      return <div>{state.count}</div>;
    });
    

    const handler = $(() => {
      const loc = useLocation(); // OK inside a $-wrapped closure.
      console.log(loc.params);
    });

  • #7685 52071f5 Thanks @denbezrukov! - Fixed #6981: The NoUnknownPseudoClass rule no longer reports local pseudo-classes when CSS Modules are used.

  • #7640 899f7b2 Thanks @arendjr! - Fixed #7638: useImportExtensions no longer emits diagnostics on valid import paths that end with a query or hash.

    Example

    // This no longer warns if `index.css` exists:
    import style from "../theme/index.css?inline";

  • #7071 a8e7301 Thanks @ptkagori! - Added the useQwikValidLexicalScope rule to the Qwik domain.

    This rule helps you avoid common bugs in Qwik components by checking that your variables and functions are declared in the correct place.

    Invalid:

    // Invalid: state defined outside the component's lexical scope.
    let state = useStore({ count: 0 });
    const Component = component$(() => {
      return (
        <button onClick$={() => state.count++}>Invalid: {state.count}</button>
      );
    });

    Valid:

    // Valid: state initialised within the component's lexical scope and captured by the event.
    const Component = component$(() => {
      const state = useStore({ count: 0 });
      return <button onClick$={() => state.count++}>Valid: {state.count}</button>;
    });

  • #7620 5beb1ee Thanks @Netail! - Added the rule useDeprecatedDate, which makes a deprecation date required for the graphql @deprecated directive.

    Invalid
    query {
      member @deprecated(reason: "Use `members` instead") {
        id
      }
    }
    Valid
    query {
      member
        @deprecated(reason: "Use `members` instead", deletionDate: "2099-12-25") {
        id
      }
    }

  • #7709 d6da4d5 Thanks @siketyan! - Fixed #7704: The useExhaustiveDependencies rule now correctly adds an object dependency when its method is called within the closure.

    For example:

    function Component(props) {
      useEffect(() => {
        props.foo();
      }, []);
    }

    will now be fixed to:

    function Component(props) {
      useEffect(() => {
        props.foo();
      }, [props]);
    }

  • #7624 309ae41 Thanks @lucasweng! - Fixed #7595: noUselessEscapeInString no longer reports $\{ escape in template literals.

  • #7665 29e4229 Thanks @ryan-m-walker! - Fixed #7619: Added support for parsing the CSS :state() pseudo-class.

    custom-selector:state(checked) {
    }

  • #7608 41df59b Thanks @ritoban23! - Fixed #7604: the useMaxParams rule now highlights parameter lists instead of entire function bodies. This provides more precise error highlighting. Previously, the entire function was highlighted; now only the parameter list is highlighted, such as (a, b, c, d, e, f, g, h).

  • #7643 459a6ac Thanks @daivinhtran! - Fixed #7580: Include plugin in summary report

2.2.5

Patch Changes

  • #7597 5c3d542 Thanks @arendjr! - Fixed #6432: useImportExtensions now works correctly with aliased paths.

  • #7269 f18dac1 Thanks @CDGardner! - Fixed #6648, where Biome’s noUselessFragments contained inconsistencies with ESLint for fragments only containing text.

    Previously, Biome would report that fragments with only text were unnecessary under the noUselessFragments rule. Further analysis of ESLint’s behavior towards these cases revealed that text-only fragments (<>A</a>, <React.Fragment>B</React.Fragment>, <RenamedFragment>B</RenamedFragment>) would not have noUselessFragments emitted for them.

    On the Biome side, instances such as these would emit noUselessFragments, and applying the suggested fix would turn the text content into a proper JS string.

    // Ended up as: - const t = "Text"
    const t = <>Text</>
    

    // Ended up as: - const e = t ? "Option A" : "Option B"
    const e = t ? <>Option A</> : <>Option B</>
    

    /* Ended up as:
      function someFunc() {
        return "Content desired to be a multi-line block of text."
      }
    */
    function someFunc() {
      return <>
        Content desired to be a multi-line
        block of text.
      <>
    }

    The proposed update was to align Biome’s reaction to this rule with ESLint’s; the aforementioned examples will now be supported from Biome’s perspective, thus valid use of fragments.

    // These instances are now valid and won't be called out by noUselessFragments.
    

    const t = <>Text</>
    const e = t ? <>Option A</> : <>Option B</>
    

    function someFunc() {
      return <>
        Content desired to be a multi-line
        block of text.
      <>
    }

  • #7498 002cded Thanks @siketyan! - Fixed #6893: The useExhaustiveDependencies rule now correctly adds a dependency that is captured in a shorthand object member. For example:

    useEffect(() => {
      console.log({ firstId, secondId });
    }, []);

    is now correctly fixed to:

    useEffect(() => {
      console.log({ firstId, secondId });
    }, [firstId, secondId]);

  • #7509 1b61631 Thanks @siketyan! - Added a new lint rule noReactForwardRef, which detects usages of forwardRef that is no longer needed and deprecated in React 19.

    For example:

    export const Component = forwardRef(function Component(props, ref) {
      return <div ref={ref} />;
    });

    will be fixed to:

    export const Component = function Component({ ref, ...props }) {
      return <div ref={ref} />;
    };

    Note that the rule provides an unsafe fix, which may break the code. Don’t forget to review the code after applying the fix.

  • #7520 3f06e19 Thanks @arendjr! - Added new nursery rule noDeprecatedImports to flag imports of deprecated symbols.

    Invalid example

    foo.js
    import { oldUtility } from "./utils.js";
    utils.js
    /**
     * @deprecated
     */
    export function oldUtility() {}

    Valid examples

    foo.js
    import { newUtility, oldUtility } from "./utils.js";
    utils.js
    export function newUtility() {}
    

    // @deprecated (this is not a JSDoc comment)
    export function oldUtility() {}

  • #7457 9637f93 Thanks @kedevked! - Added style and requireForObjectLiteral options to the lint rule useConsistentArrowReturn.

    This rule enforces a consistent return style for arrow functions. It can be configured with the following options:

    • style: (default: asNeeded)
      • always: enforces that arrow functions always have a block body.
      • never: enforces that arrow functions never have a block body, when possible.
      • asNeeded: enforces that arrow functions have a block body only when necessary (e.g. for object literals).

    style: "always"

    Invalid:

    const f = () => 1;

    Valid:

    const f = () => {
      return 1;
    };

    style: "never"

    Invalid:

    const f = () => {
      return 1;
    };

    Valid:

    const f = () => 1;

    style: "asNeeded"

    Invalid:

    const f = () => {
      return 1;
    };

    Valid:

    const f = () => 1;

    style: "asNeeded" and requireForObjectLiteral: true

    Valid:

    const f = () => {
      return { a: 1 };
    };

  • #7510 527cec2 Thanks @rriski! - Implements #7339. GritQL patterns can now use native Biome AST nodes using their PascalCase names, in addition to the existing TreeSitter-compatible snake_case names.

    engine biome(1.0)
    language js(typescript,jsx)
    

    or {
      // TreeSitter-compatible pattern
      if_statement(),
    

      // Native Biome AST node pattern
      JsIfStatement()
    } as $stmt where {
      register_diagnostic(
        span=$stmt,
        message="Found an if statement"
      )
    }

  • #7574 47907e7 Thanks @kedevked! - Fixed 7574. The diagnostic message for the rule useSolidForComponent now correctly emphasizes <For /> and provides a working hyperlink to the Solid documentation.

  • #7497 bd70f40 Thanks @siketyan! - Fixed #7320: The useConsistentCurlyBraces rule now correctly detects a string literal including " inside a JSX attribute value.

  • #7522 1af9931 Thanks @Netail! - Added extra references to external rules to improve migration for the following rules: noUselessFragments & noNestedComponentDefinitions

  • #7597 5c3d542 Thanks @arendjr! - Fixed an issue where package.json manifests would not be correctly discovered when evaluating files in the same directory.

  • #7565 38d2098 Thanks @siketyan! - The resolver can now correctly resolve .ts, .tsx, .d.ts, .js files by .js extension if exists, based on the file extension substitution in TypeScript.

    For example, the linter can now detect the floating promise in the following situation, if you have enabled the noFloatingPromises rule.

    foo.ts

    export async function doSomething(): Promise<void> {}

    bar.ts

    import { doSomething } from "./foo.js"; // doesn't exist actually, but it is resolved to `foo.ts`
    

    doSomething(); // floating promise!

  • #7542 cadad2c Thanks @mdevils! - Added the rule noVueDuplicateKeys, which prevents duplicate keys in Vue component definitions.

    This rule prevents the use of duplicate keys across different Vue component options such as props, data, computed, methods, and setup. Even if keys don’t conflict in the script tag, they may cause issues in the template since Vue allows direct access to these keys.

    Invalid examples
    <script>
    export default {
      props: ["foo"],
      data() {
        return {
          foo: "bar",
        };
      },
    };
    </script>
    <script>
    export default {
      data() {
        return {
          message: "hello",
        };
      },
      methods: {
        message() {
          console.log("duplicate key");
        },
      },
    };
    </script>
    <script>
    export default {
      computed: {
        count() {
          return this.value * 2;
        },
      },
      methods: {
        count() {
          this.value++;
        },
      },
    };
    </script>
    Valid examples
    <script>
    export default {
      props: ["foo"],
      data() {
        return {
          bar: "baz",
        };
      },
      methods: {
        handleClick() {
          console.log("unique key");
        },
      },
    };
    </script>
    <script>
    export default {
      computed: {
        displayMessage() {
          return this.message.toUpperCase();
        },
      },
      methods: {
        clearMessage() {
          this.message = "";
        },
      },
    };
    </script>

  • #7546 a683acc Thanks @siketyan! - Internal data for Unicode strings have been updated to Unicode 17.0.

  • #7497 bd70f40 Thanks @siketyan! - Fixed #7256: The useConsistentCurlyBraces rule now correctly ignores a string literal with braces that contains only whitespaces. Previously, literals that contains single whitespace were only allowed.

  • #7565 38d2098 Thanks @siketyan! - The useImportExtensions rule now correctly detects imports with an invalid extension. For example, importing .ts file with .js extension is flagged by default. If you are using TypeScript with neither the allowImportingTsExtensions option nor the rewriteRelativeImportExtensions option, it’s recommended to turn on the forceJsExtensions option of the rule.

  • #7581 8653921 Thanks @lucasweng! - Fixed #7470: solved a false positive for noDuplicateProperties. Previously, declarations in @container and @starting-style at-rules were incorrectly flagged as duplicates of identical declarations at the root selector.

    For example, the linter no longer flags the display declaration in @container or the opacity declaration in @starting-style.

    a {
      display: block;
      @container (min-width: 600px) {
        display: none;
      }
    }
    

    [popover]:popover-open {
      opacity: 1;
      @starting-style {
        opacity: 0;
      }
    }

  • #7529 fea905f Thanks @qraqras! - Fixed #7517: the useOptionalChain rule no longer suggests changes for typeof checks on global objects.

    // ok
    typeof window !== "undefined" && window.location;

  • #7476 c015765 Thanks @ematipico! - Fixed a bug where the suppression action for noPositiveTabindex didn’t place the suppression comment in the correct position.

  • #7511 a0039fd Thanks @arendjr! - Added nursery rule noUnusedExpressions to flag expressions used as a statement that is neither an assignment nor a function call.

    Invalid examples

    f; // intended to call `f()` instead
    function foo() {
      0; // intended to `return 0` instead
    }

    Valid examples

    f();
    function foo() {
      return 0;
    }

  • #7564 40e515f Thanks @turbocrime! - Fixed #6617: improved useIterableCallbackReturn to correctly handle arrow functions with a single-expression void body.

    Now the following code doesn’t trigger the rule anymore:

    [].forEach(() => void null);

2.2.4

Patch Changes

  • #7453 aa8cea3 Thanks @arendjr! - Fixed #7242: Aliases specified in package.json’s imports section now support having multiple targets as part of an array.

  • #7454 ac17183 Thanks @arendjr! - Greatly improved performance of noImportCycles by eliminating allocations.

    In one repository, the total runtime of Biome with only noImportCycles enabled went from ~23s down to ~4s.

  • #7447 7139aad Thanks @rriski! - Fixes #7446. The GritQL $... spread metavariable now correctly matches members in object literals, aligning its behavior with arrays and function calls.

  • #6710 98cf9af Thanks @arendjr! - Fixed #4723: Type inference now recognises index signatures and their accesses when they are being indexed as a string.

    Example

    type BagOfPromises = {
      // This is an index signature definition. It declares that instances of type
      // `BagOfPromises` can be indexed using arbitrary strings.
      [property: string]: Promise<void>;
    };
    

    let bag: BagOfPromises = {};
    // Because `bag.iAmAPromise` is equivalent to `bag["iAmAPromise"]`, this is
    // considered an access to the string index, and a Promise is expected.
    bag.iAmAPromise;

  • #7415 d042f18 Thanks @qraqras! - Fixed #7212, now the useOptionalChain rule recognizes optional chaining using typeof (e.g., typeof foo !== 'undefined' && foo.bar).

  • #7419 576baf4 Thanks @Conaclos! - Fixed #7323. noUnusedPrivateClassMembers no longer reports as unused TypeScript private members if the rule encounters a computed access on this.

    In the following example, member as previously reported as unused. It is no longer reported.

    class TsBioo {
      private member: number;
    

      set_with_name(name: string, value: number) {
        this[name] = value;
      }
    }

  • 351bccd Thanks @ematipico! - Added the new nursery lint rule noJsxLiterals, which disallows the use of string literals inside JSX.

    The rule catches these cases:

    <>
      <div>test</div> {/* test is invalid */}
      <>test</>
      <div>
        {/* this string is invalid */}
        asdjfl test foo
      </div>
    </>

  • #7406 b906112 Thanks @mdevils! - Fixed an issue (#6393) where the useHookAtTopLevel rule reported excessive diagnostics for nested hook calls.

    The rule now reports only the offending top-level call site, not sub-hooks of composite hooks.

    // Before: reported twice (useFoo and useBar).
    function useFoo() {
      return useBar();
    }
    function Component() {
      if (cond) useFoo();
    }
    // After: reported once at the call to useFoo().

  • #7461 ea585a9 Thanks @arendjr! - Improved performance of noPrivateImports by eliminating allocations.

    In one repository, the total runtime of Biome with only noPrivateImports enabled went from ~3.2s down to ~1.4s.

  • 351bccd Thanks @ematipico! - Fixed #7411. The Biome Language Server had a regression where opening an editor with a file already open wouldn’t load the project settings correctly.

  • #7142 53ff5ae Thanks @Netail! - Added the new nursery rule noDuplicateDependencies, which verifies that no dependencies are duplicated between the bundledDependencies, bundleDependencies, dependencies, devDependencies, overrides, optionalDependencies, and peerDependencies sections.

    For example, the following snippets will trigger the rule:

    {
      "dependencies": {
        "foo": ""
      },
      "devDependencies": {
        "foo": ""
      }
    }
    {
      "dependencies": {
        "foo": ""
      },
      "optionalDependencies": {
        "foo": ""
      }
    }
    {
      "dependencies": {
        "foo": ""
      },
      "peerDependencies": {
        "foo": ""
      }
    }

  • 351bccd Thanks @ematipico! - Fixed #3824. Now the option CLI --color is correctly applied to logging too.

2.2.3

Patch Changes

  • #7353 4d2b719 Thanks @JeetuSuthar! - Fixed #7340: The linter now allows the navigation property for view-transition in CSS.

    Previously, the linter incorrectly flagged navigation: auto as an unknown property. This fix adds navigation to the list of known CSS properties, following the CSS View Transitions spec.

  • #7275 560de1b Thanks @arendjr! - Fixed #7268: Files that are explicitly passed as CLI arguments are now correctly ignored if they reside in an ignored folder.

  • #7358 963a246 Thanks @ematipico! - Fixed #7085, now the rule noDescendingSpecificity correctly calculates the specificity of selectors when they are included inside a media query.

  • #7387 923674d Thanks @qraqras! - Fixed #7381, now the useOptionalChain rule recognizes optional chaining using Yoda expressions (e.g., undefined !== foo && foo.bar).

  • #7316 f9636d5 Thanks @Conaclos! - Fixed #7289. The rule useImportType now inlines import type into import { type } when the style option is set to inlineType.

    Example:

    import type { T } from "mod";
    // becomes
    import { type T } from "mod";

  • #7350 bb4d407 Thanks @siketyan! - Fixed #7261: two characters ・ (KATAKANA MIDDLE DOT, U+30FB) and ･ (HALFWIDTH KATAKANA MIDDLE DOT, U+FF65) are no longer considered as valid characters in identifiers. Property keys containing these character(s) are now preserved as string literals.

  • #7377 811f47b Thanks @ematipico! - Fixed a bug where the Biome Language Server didn’t correctly compute the diagnostics of a monorepo setting, caused by an incorrect handling of the project status.

  • #7245 fad34b9 Thanks @kedevked! - Added the new lint rule useConsistentArrowReturn.

    This rule enforces a consistent return style for arrow functions.

    Invalid

    const f = () => {
      return 1;
    };

    This rule is a port of ESLint’s arrow-body-style rule.

  • #7370 e8032dd Thanks @fireairforce! - Support dynamic import defer and import source. The syntax looks like:

    import.source("foo");
    import.source("x", { with: { attr: "val" } });
    import.defer("foo");
    import.defer("x", { with: { attr: "val" } });

  • #7369 b1f8cbd Thanks @siketyan! - Range suppressions are now supported for Grit plugins.

    For JavaScript, you can suppress a plugin as follows:

    // biome-ignore-start lint/plugin/preferObjectSpread: reason
    Object.assign({ foo: "bar" }, baz);
    // biome-ignore-end lint/plugin/preferObjectSpread: reason

    For CSS, you can suppress a plugin as follows:

    body {
      /* biome-ignore-start lint/plugin/useLowercaseColors: reason */
      color: #fff;
      /* biome-ignore-end lint/plugin/useLowercaseColors: reason */
    }

  • #7384 099507e Thanks @ematipico! - Reduced the severity of certain diagnostics emitted when Biome deserializes the configuration files. Now these diagnostics are emitted as Information severity, which means that they won’t interfere when running commands with --error-on-warnings

  • #7302 2af2380 Thanks @unvalley! - Fixed #7301: useReadonlyClassProperties now correctly skips JavaScript files.

  • #7288 94d85f8 Thanks @ThiefMaster! - Fixed #7286. Files are now formatted with JSX behavior when javascript.parser.jsxEverywhere is explicitly set.

    Previously, this flag was only used for parsing, but not for formatting, which resulted in incorrect formatting of conditional expressions when JSX syntax is used in .js files.

  • #7311 62154b9 Thanks @qraqras! - Added the new nursery rule noUselessCatchBinding. This rule disallows unnecessary catch bindings.

    try {
        // Do something
     } catch (unused) {}
     } catch {}

  • #7349 45c1dfe Thanks @ematipico! - Fixed #4298. Biome now correctly formats CSS declarations when it contains one single value:

    .bar {
      --123456789012345678901234567890: var(--1234567890123456789012345678901234567);
      --123456789012345678901234567890: var(
        --1234567890123456789012345678901234567
      );
    }

  • #7295 7638e84 Thanks @ematipico! - Fixed #7130. Removed the emission of a false-positive diagnostic. Biome no longer emits the following diagnostic:

    lib/main.ts:1:5 suppressions/unused ━━━━━━━━━━━━━━━━━━━━━━━━━
    

      ⚠ Suppression comment has no effect because the tool is not enabled.
    

      > 1 │ /** biome-ignore-all assist/source/organizeImports: For the lib root file, we don't want to organize exports */
          │     ^^^^^^^^^^^^^^^^

  • #7377 811f47b Thanks @ematipico! - Fixed #7371 where the Biome Language Server didn’t correctly recompute the diagnostics when updating a nested configuration file.

  • #7348 ac27fc5 Thanks @ematipico! - Fixed #7079. Now the rule useSemanticElements doesn’t trigger components and custom elements.

  • #7389 ab06a7e Thanks @Conaclos! - Fixed #7344. useNamingConvention no longer reports interfaces defined in global declarations.

    Interfaces declared in global declarations augment existing interfaces. Thus, they must be ignored.

    In the following example, useNamingConvention reported HTMLElement. It is now ignored.

    export {};
    declare global {
      interface HTMLElement {
        foo(): void;
      }
    }

  • #7315 4a2bd2f Thanks @vladimir-ivanov! - Fixed #7310: useReadonlyClassProperties correctly handles nested assignments, avoiding false positives when a class property is assigned within another assignment expression.

    Example of code that previously triggered a false positive but is now correctly ignored:

    class test {
      private thing: number = 0; // incorrectly flagged
    

      public incrementThing(): void {
        const temp = { x: 0 };
        temp.x = this.thing++;
      }
    }

2.2.2

Patch Changes

  • #7266 b270bb5 Thanks @ematipico! - Fixed an issue where Biome got stuck when analyzing some files. This is usually caused by a bug in the inference engine. Now Biome has some guards in place in case the number of types grows too much, and if that happens, a diagnostic is emitted and the inference is halted.

  • #7281 6436180 Thanks @ematipico! - Fixed an issue where the function scanProject wouldn’t work as expected.

  • #7285 1511d0c Thanks @rriski! - Partially fixed #6782: JSX node kinds are now supported in GritQL AST nodes.

  • #7249 dff85c0 Thanks @ematipico! - Fixed #748, where Biome Language Server didn’t show the unsafe fixes when requesting the quick fixes. Now all LSP editors will show also opt-in, unsafe fixes.

  • #7266 b270bb5 Thanks @ematipico! - Fixed #7020: Resolved an issue with analysing types of static member expressions involving unions. If the object type was a union that referenced nested unions, it would trigger an infinite loop as it tried to keep expanding nested unions, and the set of types would grow indefinitely.

  • #7209 679b70e Thanks @patrickshipe! - Resolved an overcorrection in useImportExtensions when importing explicit index files.

    Imports that explicitly reference an index file are now preserved and no longer rewritten to nested index paths.

    Example

    // Before
          import "./sub/index";
          import "./sub/index/index.js";
    

    // After
          import "./sub/index";
          import "./sub/index.js";

  • #7270 953f9c6 Thanks @arendjr! - Fixed #6172: Resolved an issue with inferring types for rest parameters. This issue caused rest-parameter types to be incorrect, and in some cases caused extreme performance regressions in files that contained many methods with rest-parameter definitions.

  • #7234 b7aa111 Thanks @JeetuSuthar! - Fixed #7233: The useIndexOf rule now correctly suggests using indexOf() instead of findIndex().

    The diagnostic message was incorrectly recommending Array#findIndex() over Array#indexOf(), when it should recommend the opposite for simple equality checks.

  • #7283 0b07f45 Thanks @ematipico! - Fixed #7236. Now Biome correctly migrates JSONC configuration files when they are passed using --config-path.

  • #7239 1d643d8 Thanks @minht11! - Fixed an issue where Svelte globals ($state and so on) were not properly recognized inside .svelte.test.ts/js and .svelte.spec.ts/js files.

  • #7264 62fdbc8 Thanks @ematipico! - Fixed a regression where when using --log-kind-pretty wasn’t working anymore as expected.

  • #7244 660031b Thanks @JeetuSuthar! - Fixed #7225: The noExtraBooleanCast rule now preserves parentheses when removing Boolean calls inside negations.

    // Before
    !Boolean(b0 && b1);
    // After
    !(b0 && b1); // instead of !b0 && b1

  • #7298 46a8e93 Thanks @unvalley! - Fixed #6695: useNamingConvention now correctly reports TypeScript parameter properties with modifiers.

    Previously, constructor parameter properties with modifiers like private or readonly were not checked against naming conventions. These properties are now treated consistently with regular class properties.

2.2.0

Minor Changes

  • #5506 1f8755b Thanks @sakai-ast! - The noRestrictedImports rule has been enhanced with a new patterns option. This option allows for more flexible and powerful import restrictions using gitignore-style patterns.

    You can now define patterns to restrict entire groups of modules. For example, you can disallow imports from any path under import-foo/ except for import-foo/baz.

    {
      "options": {
        "patterns": [
          {
            "group": ["import-foo/*", "!import-foo/baz"],
            "message": "import-foo is deprecated, except for modules in import-foo/baz."
          }
        ]
      }
    }

    Invalid examples

    import foo from "import-foo/foo";
    import bar from "import-foo/bar";

    Valid examples

    import baz from "import-foo/baz";

    Additionally, the patterns option introduces importNamePattern to restrict specific import names using regular expressions. The following example restricts the import names that match x , y or z letters from modules under import-foo/.

    {
      "options": {
        "patterns": [
          {
            "group": ["import-foo/*"],
            "importNamePattern": "[xyz]"
          }
        ]
      }
    }

    Invalid examples

    import { x } from "import-foo/foo";

    Valid examples

    import { foo } from "import-foo/foo";

    Furthermore, you can use the invertImportNamePattern boolean option to reverse this logic. When set to true, only the import names that match the importNamePattern will be allowed. The following configuration only allows the import names that match x , y or z letters from modules under import-foo/.

    {
      "options": {
        "patterns": [
          {
            "group": ["import-foo/*"],
            "importNamePattern": "[xyz]",
            "invertImportNamePattern": true
          }
        ]
      }
    }

    Invalid examples

    import { foo } from "import-foo/foo";

    Valid examples

    import { x } from "import-foo/foo";

  • #6506 90c5d6b Thanks @nazarhussain! - Allow customization of the sort order for different sorting actions. These actions now support a sort option:

    For each of these options, the supported values are the same:

    1. natural. Compares two strings using a natural ASCII order. Uppercase letters come first (e.g. A < a < B < b) and number are compared in a human way (e.g. 9 < 10). This is the default value.
    2. **lexicographic **. Strings are ordered lexicographically by their byte values. This orders Unicode code points based on their positions in the code charts. This is not necessarily the same as “alphabetical” order, which varies by language and locale.

  • #7159 df3afdf Thanks @ematipico! - Added the new rule useBiomeIgnoreFolder. Since v2.2, Biome correctly prevents the indexing and crawling of folders.

    However, the correct pattern has changed. This rule attempts to detect incorrect usage, and promote the new pattern:

    biome.json
    {
      "files": {
        "includes": [
          "!dist/**",
          "!**/fixtures/**",
          "!dist",
          "!**/fixtures",
        ]
      }
    }

  • #6989 85b1128 Thanks @arendjr! - Fixed minor inconsistencies in how files.includes was being handled.

    Previously, Biome sometimes failed to properly ignore the contents of a folder if you didn’t specify the /** at the end of a glob pattern. This was unfortunate, because it meant we still had to traverse the folder and then apply the glob to every entry inside it.

    This is no longer an issue and we now recommend to ignore folders without using the /** suffix.

  • #7118 a78e878 Thanks @avshalomt2! - Added support for .graphqls files. Biome can now format and lint GraphQL files that have the extension .graphqls

  • #6159 f02a296 Thanks @bavalpey! - Added a new option to Biome’s JavaScript formatter, javascript.formatter.operatorLinebreak, to configure whether long lines should be broken before or after binary operators.

    For example, the following configuration:

    {
      formatter: {
        javascript: {
          operatorLinebreak: "before", // defaults to "after"
        },
      },
    }

    Will cause this JavaScript file:

    const VERY_LONG_CONDITION_1234123412341234123412341234 = false;
    

    if (
      VERY_LONG_CONDITION_1234123412341234123412341234 &&
      VERY_LONG_CONDITION_1234123412341234123412341234 &&
      VERY_LONG_CONDITION_1234123412341234123412341234 &&
      VERY_LONG_CONDITION_1234123412341234123412341234
    ) {
      console.log("DONE");
    }

    to be formatted like this:

    const VERY_LONG_CONDITION_1234123412341234123412341234 = false;
    

    if (
      VERY_LONG_CONDITION_1234123412341234123412341234 &&
      VERY_LONG_CONDITION_1234123412341234123412341234 &&
      VERY_LONG_CONDITION_1234123412341234123412341234 &&
      VERY_LONG_CONDITION_1234123412341234123412341234
    ) {
      console.log("DONE");
    }

  • #7137 a653a0f Thanks @ematipico! - Promoted multiple lint rules from nursery to stable groups and renamed several rules for consistency.

    The following rules have been promoted from nursery to stable groups:

    CSS
    GraphQL
    JavaScript/TypeScript

    Renamed rules

    The following rules have been renamed during promotion. The migration tool will automatically update your configuration:

    Configuration files using the old rule names will need to be updated. Use the migration tool to automatically update your configuration:

    Terminal window
    biome migrate --write

  • #7159 df3afdf Thanks @ematipico! - Added the new rule noBiomeFirstException. This rule prevents the incorrect usage of patterns inside files.includes.

    This rule catches if the first element of the array contains !. This mistake will cause Biome to analyze no files:

    biome.json
    {
      files: {
        includes: ["!dist/**"], // this is an error
      },
    }

  • #6923 0589f08 Thanks @ptkagori! - Added Qwik Domain to Biome

    This release introduces **Qwik domain support ** in Biome, enabling Qwik developers to use Biome as a linter and formatter for their projects.

  • #6989 85b1128 Thanks @arendjr! - Fixed #6965: Implemented smarter scanner for project rules.

    Previously, if project rules were enabled, Biome’s scanner would scan all dependencies regardless of whether they were used by/reachable from source files or not. While this worked for a first version, it was far from optimal.

    The new scanner first scans everything listed under the files.includes setting, and then descends into the dependencies that were discovered there, including transitive dependencies. This has three main advantages:

    • Dependencies that are not reachable from your source files don’t get indexed.
    • Dependencies that have multiple type definitions, such as those with separate definitions for CommonJS and ESM imports, only have the relevant definitions indexed.
    • If vcs.useIgnoreFile is enabled, .gitignore gets respected as well. Assuming you have folders such as build/ or dist/ configured there, those will be automatically ignored by the scanner.

    The change in the scanner also has a more nuanced impact: Previously, if you used files.includes to ignore a file in an included folder, the scanner would still index this file. Now the file is fully ignored, unless you import it.

    As a user you should notice better scanner performance (if you have project rules enabled), and hopefully you need to worry less about configuring files.experimentalScannerIgnores. Eventually our goal is still to deprecate that setting, so if you’re using it today, we encourage you to see which ignores are still necessary there, and whether you can achieve the same effect by ignoring paths using files.includes instead.

    None of these changes affect the scanner if no project rules are enabled.

  • #6731 d6a05b5 Thanks @ematipico! - The --reporter=summary has been greatly enhanced. It now shows the list of files that contains violations, the files shown are clickable and can be opened from the editor.

    Below an example of the new version:

    reporter/parse ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
    

      i The following files have parsing errors.
    

      - index.css
    

    reporter/format ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
    

      i The following files needs to be formatted.
    

      - index.css
      - index.ts
      - main.ts
    

    reporter/violations ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
    

      i Some lint rules or assist actions reported some violations.
    

      Rule Name                                        Diagnostics
    

      lint/correctness/noUnknownFunction               14 (2 error(s), 12 warning(s), 0 info(s))
      lint/suspicious/noImplicitAnyLet                 16 (12 error(s), 4 warning(s), 0 info(s))
      lint/suspicious/noDoubleEquals                   8 (8 error(s), 0 warning(s), 0 info(s))
      assist/source/organizeImports                    2 (2 error(s), 0 warning(s), 0 info(s))
      lint/suspicious/noRedeclare                      12 (12 error(s), 0 warning(s), 0 info(s))
      lint/suspicious/noDebugger                       8 (8 error(s), 0 warning(s), 0 info(s))

  • #6896 527db7f Thanks @ematipico! - Added new functions to the @biomejs/wasm-* packages:

    • fileExists: returns whether the input file exists in the workspace.
    • isPathIgnored: returns whether the input path is ignored.
    • updateModuleGraph: updates the internal module graph of the input path.
    • getModuleGraph: it returns a serialized version of the internal module graph.
    • scanProject: scans the files and directories in the project to build the internal module graph.

  • #6398 d1a315d Thanks @josh-! - Added support for tracking stable results in user-provided React hooks that return objects to useExhaustiveDependencies to compliment existing support for array return values. For example:

    biome.json
    {
      // rule options
      useExhaustiveDependencies: {
        level: "error",
        options: {
          hooks: [
            {
              name: "useCustomHook",
              stableResult: ["setMyState"],
            },
          ],
        },
      },
    }

    This will allow the following to be validated:

    const { myState, setMyState } = useCustomHook();
    const toggleMyState = useCallback(() => {
      setMyState(!myState);
    }, [myState]); // Only `myState` needs to be specified here.

  • #7201 2afaa49 Thanks @Conaclos! - Implemented #7174. useConst no longer reports variables that are read before being written.

    Previously, useConst reported uninitialised variables that were read in an inner function before being written, as shown in the following example:

    let v;
    function f() {
      return v;
    }
    v = 0;

    This can produce false positives in the case where f is called before v has been written, as in the following code:

    let v;
    function f() {
      return v;
    }
    console.log(f()); // print `undefined`
    v = 0;

    Although this is an expected behavior of the original implementation, we consider it problematic since the rule’s fix is marked as safe. To avoid false positives like this, the rule now ignores the previous examples. However, this has the disadvantage of resulting in false negatives, such as not reporting the first example.

Patch Changes

  • #7156 137d111 Thanks @ematipico! - Fixed #7152. Now the rule noDuplicateFontNames correctly detects font names with spaces e.g. Liberation Mono. The diagnostic of the rule now points to the first instances of the repeated font.

    The following example doesn’t trigger the rule anymore:

    c {
      font-family:
        SF Mono,
        Liberation Mono,
        sans-serif;
    }
    d {
      font:
        1em SF Mono,
        Liberation Mono,
        sans-serif;
    }

  • #6907 7331bb9 Thanks @ematipico! - Added a new experimental option that allows parsing of .html files that contain interpolation syntax.

    biome.json
    {
      html: {
        // This is the new, experimental option.
        parser: {
          interpolation: true,
        },
      },
    }
    <h1>{{ $title }}</h1>

  • #7124 3f436b8 Thanks @Jayllyz! - Added the rule useMaxParams.

    This rule enforces a maximum number of parameters for functions to improve code readability and maintainability. Functions with many parameters are difficult to read, understand, and maintain because they require memorizing parameter order and types.

    // Invalid - too many parameters (default max: 4)
    function processData(
      name,
      age,
      email,
      phone,
      address,
      city,
      country,
      zipCode,
    ) {
      // ...
    }
    

    // Valid - within parameter limit
    function processData(userData) {
      const { name, age, email, phone, address, city, country, zipCode } =
        userData;
      // ...
    }
    

    function calculateSum(a, b, c) {
      return a + b + c;
    }

  • #7161 1a14a59 Thanks @ematipico! - Fixed #7160. Now Biome correctly computes ignored files when using formatter.includes, linter.includes and assist.includes inside nested configurations that use "extends": "//".

  • #7081 a081bbe Thanks @Jayllyz! - Added the rule noNextAsyncClientComponent.

    This rule prevents the use of async functions for client components in Next.js applications. Client components marked with “use client” directive should not be async as this can cause hydration mismatches, break component rendering lifecycle, and lead to unexpected behavior with React’s concurrent features.

    "use client";
    

    // Invalid - async client component
    export default async function MyComponent() {
      return <div>Hello</div>;
    }
    

    // Valid - synchronous client component
    export default function MyComponent() {
      return <div>Hello</div>;
    }

  • #7171 5241690 Thanks @siketyan! - Fixed #7162: The noUndeclaredDependencies rule now considers a type-only import as a dev dependency.

    For example, the following code is no longer reported:

    package.json:

    {
      "devDependencies": {
        "type-fest": "*"
      }
    }

    foo.ts:

    import type { SetRequired } from "type-fest";

    Note that you still need to declare the package in the devDependencies section in package.json.

2.1.4

Patch Changes

  • #7121 b9642ab Thanks @arendjr! - Fixed #7111: Imported symbols using aliases are now correctly recognised.

  • #7103 80515ec Thanks @omasakun! - Fixed #6933 and #6994.

    When the values of private member assignment expressions, increment expressions, etc. are used, those private members are no longer marked as unused.

  • #6887 0cc38f5 Thanks @ptkagori! - Added the noQwikUseVisibleTask rule to Qwik.

    This rule is intended for use in Qwik applications to warn about the use of useVisibleTask$() functions which require careful consideration before use.

    Invalid:

    useVisibleTask$(() => {
      console.log("Component is visible");
    });

    Valid:

    useTask$(() => {
      console.log("Task executed");
    });

  • #7084 50ca155 Thanks @ematipico! - Added the new nursery rule noUnnecessararyConditions, which detects whenever some conditions don’t change during the life cycle of the program, and truthy or false, hence deemed redundant.

    For example, the following snippets will trigger the rule:

    // Always truthy literal conditions
    if (true) {
      console.log("always runs");
    }
    // Unnecessary condition on constrained string type
    function foo(arg: "bar" | "baz") {
      if (arg) {
        // This check is unnecessary
      }
    }

  • #6887 0cc38f5 Thanks @ptkagori! - Added the useImageSize rule to Biome.

    The useImageSize rule enforces the use of width and height attributes on <img> elements for performance reasons. This rule is intended to prevent layout shifts and improve Core Web Vitals by ensuring images have explicit dimensions.

    Invalid:

    <img src="/image.png" />
    <img src="https://example.com/image.png" />
    <img src="/image.png" width="200" />
    <img src="/image.png" height="200" />

    Valid:

    <img width="200" height="600" src="/static/images/portrait-01.webp" />
    <img width="100" height="100" src="https://example.com/image.png" />

  • #6887 0cc38f5 Thanks @ptkagori! - Added the useAnchorHref rule to Biome.

    The useAnchorHref rule enforces the presence of an href attribute on <a> elements in JSX. This rule is intended to ensure that anchor elements are always valid and accessible.

    Invalid:

    <a>Link</a>
    <a target="_blank">External</a>

    Valid:

    <a href="/home">Home</a>
    <a href="https://example.com" target="_blank">
      External
    </a>

  • #7100 29fcb05 Thanks @Jayllyz! - Added the rule noNonNullAssertedOptionalChain.

    This rule prevents the use of non-null assertions (!) immediately after optional chaining expressions ( ?.). Optional chaining is designed to safely handle nullable values by returning undefined when the chain encounters null or undefined. Using a non-null assertion defeats this purpose and can lead to runtime errors.

    // Invalid - non-null assertion after optional chaining
    obj?.prop!;
    obj?.method()!;
    obj?.[key]!;
    obj?.prop!;
    

    // Valid - proper optional chaining usage
    obj?.prop;
    obj?.method();
    obj?.prop ?? defaultValue;
    obj!.prop?.method();

  • #7129 9f4538a Thanks @drwpow! - Removed option, combobox, listbox roles from useSemanticElements suggestions

  • #7106 236deaa Thanks @arendjr! - Fixed #6985: Inference of return types no longer mistakenly picks up return types of nested functions.

  • #7102 d3118c6 Thanks @omasakun! - Fixed #7101: noUnusedPrivateClassMembers now handles members declared as part of constructor arguments:

    1. If a class member defined in a constructor argument is only used within the constructor, it removes the private modifier and makes it a plain method argument.
    2. If it is not used at all, it will prefix it with an underscore, similar to noUnusedFunctionParameter.

  • #7104 5395297 Thanks @harxki! - Reverting to prevent regressions around ref handling

  • #7143 1a6933a Thanks @siketyan! - Fixed #6799: The noImportCycles rule now ignores type-only imports if the new ignoreTypes option is enabled (enabled by default).

    [!WARNING] Breaking Change: The noImportCycles rule no longer detects import cycles that include one or more type-only imports by default. To keep the old behaviour, you can turn off the ignoreTypes option explicitly:

    {
      "linter": {
        "rules": {
          "nursery": {
            "noImportCycles": {
              "options": {
                "ignoreTypes": false
              }
            }
          }
        }
      }
    }

  • #7099 6cc84cb Thanks @arendjr! - Fixed #7062: Biome now correctly considers extended configs when determining the mode for the scanner.

  • #6887 0cc38f5 Thanks @ptkagori! - Added the useQwikClasslist rule to Biome.

    This rule is intended for use in Qwik applications to encourage the use of the built-in class prop (which accepts a string, object, or array) instead of the classnames utility library.

    Invalid:

    <div class={classnames({ active: true, disabled: false })} />

    Valid:

    <div classlist={{ active: true, disabled: false }} />

  • #7019 57c15e6 Thanks @fireairforce! - Added support in the JS parser for import source(a stage3 proposal). The syntax looks like:

    import source foo from "<specifier>";

  • #7053 655049e Thanks @jakeleventhal! - Added the useConsistentTypeDefinitions rule.

    This rule enforces consistent usage of either interface or type for object type definitions in TypeScript.

    The rule accepts an option to specify the preferred style:

    • interface (default): Prefer using interface for object type definitions
    • type: Prefer using type for object type definitions

    Examples:

    // With default option (interface)
    // ❌ Invalid
    type Point = { x: number; y: number };
    

    // ✅ Valid
    interface Point {
      x: number;
      y: number;
    }
    

    // With option { style: "type" }
    // ❌ Invalid
    interface Point {
      x: number;
      y: number;
    }
    

    // ✅ Valid
    type Point = { x: number; y: number };

    The rule will automatically fix simple cases where conversion is straightforward.

2.1.3

Patch Changes

  • #7057 634a667 Thanks @mdevils! - Added the rule noVueReservedKeys, which prevents the use of reserved Vue keys.

    It prevents the use of Vue reserved keys such as those starting with like $el, $data, $props) and keys starting with \_ in data properties, which can cause conflicts and unexpected behavior in Vue components.

    Invalid example
    <script>
    export default {
      data: {
        $el: "",
        _foo: "bar",
      },
    };
    </script>
    <script>
    export default {
      computed: {
        $data() {
          return this.someData;
        },
      },
    };
    </script>
    Valid examples
    <script>
    export default {
      data() {
        return {
          message: "Hello Vue!",
          count: 0,
        };
      },
    };
    </script>
    <script>
    export default {
      computed: {
        displayMessage() {
          return this.message;
        },
      },
    };
    </script>

  • #6941 734d708 Thanks @JamBalaya56562! - Added @eslint-react/no-nested-component-definitions as a rule source for noNestedComponentDefinitions. Now it will get picked up by biome migrate --eslint.

  • #6463 0a16d54 Thanks @JamBalaya56562! - Fixed a website link for the useComponentExportOnlyModules linter rule to point to the correct URL.

  • #6944 e53f2fe Thanks @sterliakov! - Fixed #6910: Biome now ignores type casts and assertions when evaluating numbers for noMagicNumbers rule.

  • #6991 476cd55 Thanks @denbezrukov! - Fixed #6973: Add support for parsing the :active-view-transition-type() pseudo-class

    :active-view-transition-type(first second) {
    }

  • #6992 0b1e194 Thanks @ematipico! - Added a new JSON rule called noQuickfixBiome, which disallow the use of code action quickfix.biome inside code editor settings.

  • #6943 249306d Thanks @JamBalaya56562! - Fixed @vitest/eslint-plugin source url.

  • #6947 4c7ed0f Thanks @JamBalaya56562! - Fixed ESLint migration for the rule prefer-for from eslint-plugin-solid to Biome’s useForComponent.

  • #6976 72ebadc Thanks @siketyan! - Fixed #6692: The rules noUnusedVariables and noUnusedFunctionParameters no longer cause an infinite loop when the suggested name is not applicable (e.g. the suggested name is already declared in the scope).

  • #6990 333f5d0 Thanks @rvanlaarhoven! - Fixed the documentation URL for lint/correctness/noUnknownPseudoClass

  • #7000 4021165 Thanks @harxki! - Fixed #6795: noUnassignedVariables now correctly recognizes variables used in JSX ref attributes.

  • #7044 b091ddf Thanks @ematipico! - Fixed #6622, now the rule useSemanticElements works for JSX self-closing elements too.

  • #7014 c4864e8 Thanks @siketyan! - Fixed #6516: The biome migrate command no longer break the member list with trailing comments.

  • #6979 29cb6da Thanks @unvalley! - Fixed #6767: useSortedClasses now correctly removes leading and trailing whitespace in className.

    Previously, trailing spaces in className were not fully removed.

    // Think we have this code:
    <div className="text-sm font-bold            " />
    

    // Before: applied fix, but a trailing space was preserved
    <div className="font-bold text-sm " />
    

    // After: applied fix, trailing spaces removed
    <div className="font-bold text-sm" />

  • #7055 ee4828d Thanks @dyc3! - Added the nursery rule useReactFunctionComponents. This rule enforces the preference to use function components instead of class components.

    Valid:

    function Foo() {
      return <div>Hello, world!</div>;
    }

    Invalid:

    class Foo extends React.Component {
      render() {
        return <div>Hello, world!</div>;
      }
    }

  • #6924 2d21be9 Thanks @ematipico! - Fixed #113, where the Biome Language Server didn’t correctly update the diagnostics when the configuration file is modified in the editor. Now the diagnostics are correctly updated every time the configuration file is modified and saved.

  • #6931 e6b2380 Thanks @arendjr! - Fixed #6915: useHookAtTopLevel no longer hangs when rules call themselves recursively.

  • #7012 01c0ab4 Thanks @siketyan! - Fixed #5837: Invalid suppression comments such as biome-ignore-all-start or biome-ignore-all-end no longer causes a panic.

  • #6949 48462f8 Thanks @fireairforce! - Support parse import defer(which is a stage3 proposal). The syntax look like this:

    import defer * as foo from "<specifier>";

  • #6938 5feb5a6 Thanks @vladimir-ivanov! - Fixed #6919 and #6920: useReadonlyClassProperties now does checks for mutations in async class methods.

    Example:

    class Counter3 {
      private counter: number;
      async count() {
        this.counter = 1;
        const counterString = `${this.counter++}`;
      }
    }

  • #6942 cfda528 Thanks @sterliakov! - Fixed #6939. Biome now understands this binding in classes outside of methods.

Copyright (c) 2023-present Biome Developers and Contributors.