Skip to content
Biome
Docs Enterprise Playground
Blog

Version History
All versions All versions forward

Version 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.

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