mcpField
P
prettier-compare

prettier-compare

github.com/biomejsテスト・品質26.0k73 回インストール今日更新
リポジトリ

prettier-compare について

prettier-compareは、フォーマッターの変更を出荷する前にBiomeとPrettierの整形結果を比較するBun製CLIスキルです。コード片、ファイル、標準入力に対応し、比較前にBiome WASMを再ビルドします。

主な機能

  1. 01BiomeとPrettierの出力比較
  2. 02中間表現出力の確認
  3. 03コード片・ファイル・標準入力の処理
  4. 04比較前のBiome WASM再ビルド

活用シーン

  1. 01出荷前のフォーマッター変更確認
  2. 02コード片の整形結果比較
  3. 03ファイルやエディター選択範囲の出力確認

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/biomejs/biome --skill prettier-compare

インストール後、Claude Code で/prettier-compareを入力して読み込まれたか確認します。

詳細

目的

フォーマッターの変更をリリースする前に、packages/prettier-compare/ を使って、Biome と Prettier のフォーマット結果の違い(IR 出力を含む)を確認します。

前提条件

  1. 相対パスが正しく解決されるよう、すべてのコマンドをリポジトリのルートから実行します。
  2. bun を使用します(CLI は Bun スクリプトです)。依存関係がインストールされていることを確認してください。
  3. Biome の WASM バンドルを現在の Rust の変更に合わせるため、必ず --rebuild を指定します。

コードの規約

重要:絵文字は禁止です

Prettier 比較用のコードと出力では、絵文字を禁止します。

  • 比較スクリプトに絵文字を使用しないでください
  • テストファイルに絵文字を使用しないでください
  • 出力や診断メッセージに絵文字を使用しないでください

コードはすべて、プロフェッショナルで絵文字のない状態にしてください。

よくあるワークフロー

CLI 引数として渡すスニペット:

bun packages/prettier-compare/bin/prettier-compare.js --rebuild 'const x={a:1,b:2}'

言語を強制的に指定する(ツールがファイル名から言語を推測できない場合に便利です):

bun packages/prettier-compare/bin/prettier-compare.js --rebuild -l ts 'const x: number = 1'

ディスク上のファイルを比較する:

bun packages/prettier-compare/bin/prettier-compare.js --rebuild -f src/example.tsx

標準入力から読み取る(エディターで選択した範囲をパイプで渡す場合に便利です):

echo 'const x = 1' | bun packages/prettier-compare/bin/prettier-compare.js --rebuild -l js

ヒント

  • 拡張子のないコードをフォーマットする場合は、-l/--language を使って、両方のフォーマッターが正しいパーサーを選択するようにします。
  • 大きなサンプルやスナップショットテストには、-f/--file を使うと、プロジェクトのフィクスチャを直接使って反復できます。
  • CLI の詳細については packages/prettier-compare/README.md を参照してください。ここで更新を反映する場合も、コマンドに --rebuild を含めるという必須要件を守ってください。
  • CLI 引数として渡すコードスニペットには、シェルによる解釈の問題を避けるため、シングルクォートを使用します。
  • CLI 引数として渡した "\n" は改行にエスケープされません。実際の改行を記述するか、代わりにファイルを使用してください。
  • --rebuild を指定しても、読み取り専用モードや計画モードでこのツールを実行できます。Biome の WASM バンドルを再ビルドするだけで、ソースファイルは変更されません。

コメント