コンテンツにスキップ

Biome v2—コードネーム:Biotype

プロジェクトのブランド:"Biome, toolchain of the web" プロジェクトのブランド:"Biome, toolchain of the web"

Biome v2が正式にリリースされました!🍾 Biome v2—コードネーム:Biotypeは、TypeScriptコンパイラに依存せず型認識リンティングルールを提供する初のJavaScriptおよびTypeScriptリンターです!つまり、typescriptパッケージをインストールせずにプロジェクトをリントできます。

このリリースにより、プロジェクトのコアコントリビューターは、Biomeが次世代のWebツールチェーンとしての地位を確立する価値があることを、コミュニティとWebエコシステム全体に示したいと考えています。 この短期間(2年間)と限られたリソースで、ここまでの成果を上げたツールは他にありません。プロジェクトを信じて支えてくれた企業や皆さんのおかげです。特に、型推論の作業をスポンサーしてくれたVercelに感謝します。

事前テストでは、新しい型推論に基づくnoFloatingPromisesルールが、typescript-eslintで検出されるFloating Promiseのケースの約75%を、パフォーマンスへの影響をほんのわずかに抑えて検出できることが示されています。言うまでもなく、この指標をさらに改善するアイデアも豊富にあります。

これらの初期の数値は限られた使用例に基づいているため、実際の結果は異なる場合があります。ぜひ実際に試して、フィードバックを聞かせてください。そのフィードバックは、ほとんどのプロジェクトに十分な信頼性のレベルに迅速に到達することに寄与します。

@biomejs/biomeパッケージをインストールまたは更新します。パッケージをアップグレードする場合は、migrateコマンドを実行してください。

Terminal window
npm install --save-dev --save-exact @biomejs/biome
npx @biomejs/biome migrate --write

migrateコマンドは、設定のすべての破壊的変更を処理するので、手動で行う必要はありません。ただし、自動化できなかった変更がいくつかあります。移行ガイドを作成し、該当する場合は手動の移行パスとともに説明しています。一部の変更はBiomeの核となる機能を大きく改善しています。最初は戸惑うかもしれませんが、ぜひ少しずつ慣れてみてください。

Biomeには、大小さまざまな新機能が満載です。ここでは、特に言及する価値があると思われるものに焦点を当てます。新機能の完全なリストについては、changelogを参照してください。

これら2つの機能は密接に関連しています。他のモジュールからインポートされた型をクエリする機能なしに、型推論エンジンを作成することはできません。

バージョン2.0以前、Biomeのリントルールは一度に1つのファイルでしか動作できませんでした。これでも十分多くのことが可能でしたが、より興味深い多くのルールでは他ファイルからの情報が必要です。

これを実現するために、IDEのLSPサービスと同様に、プロジェクト内のすべてのファイルをスキャンしてインデックス化する ファイルスキャナー をBiomeに追加しました。

ファイルスキャナーには避けられない問題があります:速度の低下です。多くのユーザーが速度を理由にBiomeを選んでいることを認識しています。ベータ期間中、ユーザーはこれがワークフローにどのような影響を与えるかについて懸念を示しました。

このリリースにおけるファイルスキャナーには次の特性があります:

  • オプトインです。つまり、v1からv2への移行がプロジェクトのフォーマットとリントのパフォーマンスに大きな影響を与えることはありません。
  • デフォルトでは、スキャナーはネストされた設定ファイルの検出にのみ使用されます。これは非常に高速ですが、v1と比較してわずかな増加が見られる場合があります。
  • フルスキャン(プロジェクトファイルおよびnode_modulesをすべてスキャン)は、プロジェクトルールが有効になっている場合のみ実行されます。
  • ユーザーはfiles.includesを使用してスキャンされるファイルを制御できます(node_modulesを除く)。
  • 型を収集したりモジュールグラフをクエリしたりする必要があるリントルールは、projectドメイン以外では決して推奨されません。速度とパフォーマンスを最優先し、ユーザーがルールを制御できるようにします。

モノレポのサポートを大幅に改善しました。これは、package.jsonファイルからの情報に依存するリントルールが、適切なパッケージのpackage.jsonを使用するようになったことを意味します。しかし、おそらくより重要なのは:ネストされた設定ファイルをサポートするようになりました。

各プロジェクトは、Biome v1と同様に、ルートに単一のbiome.jsonまたはbiome.jsoncを持つ必要があります。しかし、プロジェクトはサブディレクトリに任意の数のネストされたbiome.json/biome.jsoncファイルを持つことができます。ネストされた設定ファイルは、2つの方法のいずれかで明示的に示す必要があります。

最初の方法:

biome.jsonc
{
"root": false,
// ...
}

rootフィールドをfalseに設定することで、これがネストされたファイルであることをBiomeに伝えます。これは重要です。なぜなら、ネストされたフォルダー内でBiomeを実行した場合、設定がより大きなプロジェクトの一部であることを認識し、ルート設定も探し続けるからです。

ネストされたフォルダー内の設定は、デフォルトではルート設定から継承されないことを強調しておきます。別の設定から拡張したい場合は、Biome v1で既に存在していたextendsフィールドを使用する必要があります。

これにより、ネストされた設定を定義する2番目の方法に移ります:

biome.jsonc
{
"extends": "//",
// ...
}

これは便利なマイクロ構文で、rootフィールドをfalseに設定し、このネストされた設定がルート設定から拡張することをBiomeに伝えます。

"extends": ["../../biome.json"]のような不格好な相対パスにさよなら 👋

セットアップの参考になる小さなガイドを用意しました。

Biome 2.0には、リンタープラグインの最初のイテレーションが搭載されています。

これらのプラグインはまだスコープが限定されています:コードスニペットをマッチさせ、それらに対して診断を報告することしかできません。

以下は、Object.assign()の使用を報告するプラグインの例です:

`$fn($args)` where {
$fn <: `Object.assign`,
register_diagnostic(
span = $fn,
message = "Prefer object spread instead of `Object.assign()`"
)
}

これは最初のステップですが、プラグインをより強力にするためのアイデアがたくさんあり、ユーザーから何を優先してほしいかを聞くことを楽しみにしています。

現時点では、さまざまな理由から、プラグインの配布方法を意図的に除外しました。しかし、皆さんからの意見をお聞きしたいです。ディスカッションに参加して、アイデアを共有してください。

Biome 1.xでは、Import Organizerにはいくつかの制限がありました:

  • 空行で区切られたインポートのグループは別々の チャンク と見なされ、独立してソートされていました。これは、次の例が期待どおりに動作しないことを意味していました:

    example.js
    import { lib2 } from "library2";
    import { util } from "./utils.js";
    import { lib1 } from "library1";

    "library1""./utils.js"の上に配置するように正しくソートしますが、空行を越えて一番上に運ぶことはできませんでした。得られた結果は次のとおりです:

    organizer_v1.js
    import { lib2 } from "library2";
    import { lib1 } from "library1";
    import { util } from "./utils.js";

    しかし、本当に欲しかったのはこれです:

    organizer_v2.js
    import { lib1 } from "library1";
    import { lib2 } from "library2";
    import { util } from "./utils.js";
  • 同じモジュールからのインポートはマージされませんでした。次の例を考えてみてください:

    example.js
    import { util1 } from "./utils.js";
    import { util2 } from "./utils.js";

    欲しかったのはこれです:

    organizer_v2.js
    import { util1, util2 } from "./utils.js";
  • カスタムの並べ替えを設定できませんでした。おそらく、インポート元からの「距離」で並べ替えるデフォルトのアプローチがあまり好きではなかったでしょう。次のようにインポートを整理したかったでしょう:

    organizer_v2.js
    import { open } from "node:fs";
    import { internalLib1 } from "@company/library1";
    import { internalLib2 } from "@company/library2";
    import { lib1 } from "library1";

Biome 2.0では、これらすべての制限が解除されています。実際、上記の例を見ると、organizer_v2.jsとラベル付けされたすべてのスニペットは、新しいImport Organizerによってそのまま生成できます。

その他の改善点には、export文の整理のサポート、必要に応じてインポートチャンクを明示的に分離するための「分離された」コメントのサポート、インポート属性のソートなどがあります。

詳細はアクションのドキュメントをご覧ください。

Import Organizerは、Biomeではいつも少し特殊なケースでした。リンターにもフォーマッターにも属していませんでした。これは、リンターのように診断を表示したくなかったことと、その整理機能がフォーマッターに期待するものを超えていたためです。

Biome 2.0では、このような使用例をBiomeアシストの形で一般化しました。アシストはアクションを提供します。これはリントルールの 修正 に似ていますが、診断はありません。

Import Organizerはアシストになりましたが、新しいアシストにもこのアプローチを使い始めました:useSortedKeysはオブジェクトリテラルのキーをソートでき、useSortedAttributesはJSXの属性をソートできます。

アシストの詳細については、関連ページを参照してください。

既にサポートしていた // biome-ignore コメントに加えて、ファイル全体でリントルールまたはフォーマッターを抑制するための // biome-ignore-all をサポートするようになりました。

また、// biome-ignore-start// biome-ignore-end を使用した抑制範囲のサポートも追加しました。ファイルの終わりまで範囲を実行したい場合は、// biome-ignore-end はオプションです。

抑制の詳細については、関連ページを参照してください。

数ヶ月の努力の末、HTMLフォーマッターをユーザーが試してバグを報告できる準備が整ったことを発表できることを嬉しく思います!これは、BiomeがVueやSvelteなどのフレームワークで使用されるHTML系のテンプレート言語を完全にサポートするための大きな一歩です。

現時点では、HTMLフォーマッターは実際の.htmlファイルのみに触れるため、.vue.svelteファイル内のHTMLはまだフォーマットしません。また、JavaScriptやCSSなどの埋め込み言語もまだフォーマットしません。attributePositionbracketSameLinewhitespaceSensitivityなどのHTMLのオプションが実装されています。

HTMLフォーマッターはまだ実験段階にあるため、2.0の完全リリースではデフォルトで無効のままです。執筆時点で、BiomeはPrettierのHTMLテストスイートの大部分を解析でき、124個のうち46個を正しくフォーマットできます。まだPrettierと一致していませんが、何も破壊することなく適切にフォーマットされたドキュメントを出力すべきであることにかなり自信があります。そうでないケースを見つけた場合は、お知らせください

設定ファイルに以下を追加することで、HTMLフォーマッターを有効にできます:

{
"html": {
"formatter": {
"enabled": true
}
}
}

そして今、功績があるところに功績を与えましょう!

it's

プラチナスポンサーのVercelに特別な感謝を捧げます。 Core Contributor Member @arendjr @arendjr が率いる型推論プロジェクトをスポンサーしていただきました

VercelVercel

ゴールドスポンサーのDepotに特別な感謝を捧げます。プロジェクトに強力で高速なCIランナーを提供していただきました。大幅な時間の節約信頼性の向上をもたらしました!

DepotDepot

最近プロジェクトのコアコントリビューターになった Core Contributor Member @siketyan @siketyan に祝福を!彼らの貢献のおかげで、JetBrains拡張機能は安定し、複数のワークスペースをサポートするようになりました。

Import Organizerの刷新、新しいglobエンジン、多くの新しいリントルールの実装など、大規模な作業を行った Core Contributor Member @conaclos @conaclos に感謝します。

マルチファイルアーキテクチャの作成、型推論、プラグイン、その他の改善に関する継続的な作業を行った Core Contributor Member @arendjr @arendjr に感謝します。

GitHub Actionを作成し、VS Code拡張機能の新バージョンをリリースした Core Contributor Member @nhedger @nhedger に敬意を表します。

HTMLパーサーとフォーマッターの作業を主導した Core Contributor Member @dyc3 @dyc3 に感謝します。これらは両方とも非常に複雑なソフトウェアであり、特にPrettierのフォーマット体験に合わせることに関してはそうです。

最後になりましたが、他のすべてのスポンサーコントリビューターにも大きな感謝を!

どんなソフトウェアにもバグはつきものです。私たちはそれらを確実に潰し、パッチをリリースしていきます。

コアコントリビューターは、2025年のロードマップを進め、次の機能に焦点を当てます:

  • HTMLサポートの安定化
  • Vue、Svelte、Astroなどの他のフレームワークをサポートするようにHTMLを拡張する。
  • パーサーから始めて、Markdownサポートに取り組む。
  • より多くのケースをカバーし、新しいルールを追加できるように、推論インフラストラクチャの作業を続ける。
  • その他多数!

この方向性が気に入っています、どうすれば手伝えますか?

Section titled “この方向性が気に入っています、どうすれば手伝えますか?”

Biomeは、プログラミング、オープンソース、Biomeの哲学を愛するボランティアによって主導されているプロジェクトであることを思い出してください。どんな助けも歓迎します 😁

Biomeに精通していて、その普及に貢献したい場合は、ウェブサイトを母国語に翻訳することで私たちを支援できます。このダッシュボードで、サポートされている言語と最新かどうかを確認できます。

Discordサーバーに参加して、コミュニティと交流しましょう。コミュニティとチャットし、コミュニティの一員であることは、貢献の一形態です。

プロジェクトの技術的側面が好きで、Rust言語への道を歩みたい、またはパーサー、コンパイラー、アナライザーなどに関する知識を実践したい場合、Biomeはあなたのためのプロジェクトです!

探求すべき多くの側面があります。退屈することはないと保証します。以下は、始められるものの小さなリストです:

プロジェクトの将来を信じている場合は、Open CollectiveまたはGitHub Sponsorsを通じて財政的な貢献で支援することもできます。

さらに、プロジェクトはエンタープライズサポートプログラムを提供しており、企業はコアコントリビューターの1人を雇ってBiomeツールチェーンの特定の側面に取り組むことができます。