oxfmt について
Oxfmtの設定と利用を支援するワークフロースキルです。フォーマット、並べ替え、移行、エディター設定、CIチェックを扱い、リポジトリの既存ルールを確認してから変更をOxfmtで検証します。
主な機能
- 01既存のフォーマッター設定を確認
- 02Oxfmtとコマンドラインの設定
- 03インポートや対応形式の内容を並べ替え
- 04PrettierまたはBiomeからの移行を案内
- 05CIでフォーマットを検証
活用シーン
- 01リポジトリにOxfmtを設定
- 02PrettierまたはBiomeから移行
- 03変更ファイルのフォーマットチェックを追加
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ dobroslavradosavljevic/ skills --skill oxfmtインストール後、Claude Code で/oxfmtを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
agents/openai.yamlreferences/languages-sorting-ignores.mdprettier-migration-ci.mdsetup-cli-config.mdsource-map.mdusage-guide.md詳細
Oxfmt
Oxfmt または Oxc のフォーマットに関わる作業(インストール/設定、日常的な使い方、Prettier/Biome からの移行、追加のソート機能、言語サポート、エディター、CI の --check ゲート)では、このスキルを使用してください。
ワークフロー
- コードを変更する前に、ローカルの Oxfmt の設定状況を確認します。
oxfmtのパッケージバージョン(1.0 までは 0.x/ベータ版 のままです。前回の更新時点では 0.71)。- 設定:
defineConfigを使うoxfmt.config.ts/.mtsを推奨します。.oxfmtrc.json(c) も使用できます(ディレクトリごとにいずれか1種類)。Vite+ では代わりにvite.config.*のfmtを使用できます(Vite+ モードではネストした設定は常に無効です)。 - 残っている Prettier/Biome の設定、
.prettierignore、スクリプト(format/format:check)、エディターのデフォルトフォーマッター。
- セットアップ、使い方、スタイルの選択、ソート、モノレポ、Oxlint との併用、トラブルシューティングについては、まずガイド全体を確認してください:usage-guide.md。
- バージョンがスナップショットと異なる場合や、言語サポート、ソート、移行に関わる作業では、最新の公式ドキュメントを確認してください。source-map.md から始めます。
- 詳細については、該当するリファレンスを参照してください。
- インストール、CLI、設定オプション、editorconfig:setup-cli-config.md。
- 言語、ソート(imports/Tailwind/package.json/JSDoc)、無視設定、インラインコメント:languages-sorting-ignores.md。
- Prettier/Biome からの移行、併用、CI、
.vscodeの設定:prettier-migration-ci.md。
- 移行する場合、またはユーザーから変更を求められた場合を除き、プロジェクトの印字幅、引用符/セミコロンのスタイル、
experimentalOperatorPositionを維持します。 - 変更したパスに対して
bunx oxfmt --check(CI)またはbunx oxfmt(書き込み)を実行して検証します。
基本的な判断基準
- Oxfmt は JS/TS で Prettier と互換性があります(目標は Prettier の出力との一致です。最近の Prettier との差分はバグです)。まだ 1.0 ではないため、ロックファイルでバージョンを固定してください。
- デフォルトのモードは 書き込み です。CI のゲートには
oxfmt --checkを使用します(差分がある場合は終了コード 1、対象ファイルがない場合は終了コード 2)。 - Prettier 形式の CLI スタイルフラグ(
--no-semiなど)はありません。スタイルは設定ファイルでのみ指定できます。 - デフォルトの
printWidthは 100 で、Prettier の 80 とは異なります。差分を最小限に抑えて移行するには、printWidth: 80を設定してください。 - 新しい設定には
oxfmt.config.tsとdefineConfigを推奨します。プロジェクトですでに使用している場合に限り、.oxfmtrc.jsonを維持または使用してください。--init/--migrateは引き続き JSON を出力するため、新しい設定を追加するときは TS に変換してください。 - 新しいプロジェクトでは
ignorePatternsを推奨します。移行中は.prettierignoreも引き続き使用できます。パターンでは..を使用できず、設定ディレクトリの外にあるファイルにも一致できません。 .gitignoreが適用されるのは ディレクトリを走査する場合 であり、明示的に指定したファイルには適用されません。パスとして渡された Git 管理対象外のディレクトリは、引き続きスキップされます。- 組み込みのソート機能(
sortImports、sortTailwindcss、sortPackageJson、jsdoc)は Prettier プラグインの代わりになります。Prettier プラグインは サポートされていません。 - Tailwind:
sortTailwindcssを有効にし、stylesheet(v4)またはconfig(v3)を設定します。ヘルパー(cn/clsx/…)はfunctionsに列挙します。パスは Oxfmt の設定を基準とした相対パスです。 sortPackageJsonはデフォルトで 有効 です。package.jsonに差分が出ることを想定してください。不要な場合は無効にします。experimentalOperatorPositionはサポートされています("start" | "end"、デフォルトは"end")。experimentalTernariesは引き続き サポートされていません。- YAML(
.yml/.yaml)は ネイティブ対応 です。HTML/Vue/Svelte/Markdown/MDX/Handlebars/MJML は、引き続きバンドルされた Prettier 3.9.9 によって処理されます(Vue/Svelte の<script>はネイティブ対応です。ネイティブの Markdown 対応は進行中です)。 - エディター:フォーマットと import/Tailwind のソートは Oxfmt が担当します。
editor.formatOnSaveModeを"file"に設定してください(Oxfmt は部分的なフォーマットには対応していません)。未使用コードの削除はsource.fixAll.oxcを使って Oxlint が担当します。TS のorganizeImports/removeUnusedImportsは無効にしてください。 - 同じパイプライン内で、Oxfmt を Prettier や Biome と併用してフォーマッターとして実行しないでください。
- Oxfmt はフォーマットを行いますが、リンターの代わりにはなりません。
eslint-plugin-prettierは削除し、ESLint を引き続き使用する場合に限りeslint-config-prettierを残してください。 - Oxfmt がサポートするまで、Astro や Prettier プラグインが必要なフォーマットは移行の妨げになる場合があります。
検証
リポジトリで管理されているコマンドを優先してください。Oxfmt に関する重要な作業では、該当する範囲を確認してください。
- 変更したパス、または CI との整合性を確認するためのリポジトリ全体に対して、
bunx oxfmt --checkを実行します。 - フォーマットを適用する場合は、ローカルで
bunx oxfmtまたは lint-staged を実行します。 - Prettier からの移行後は、JS/TS の差分を抜き取り確認し、
printWidthとexperimentalOperatorPositionを確認します。準備が整ったら、Prettier のスクリプトと依存関係を削除します。 - 並べ替えについては、
sortImports、Tailwind(stylesheetまたはconfig+functions)、およびpackage.jsonの動作がチームの期待に沿っていることを確認します。 - Oxc 拡張機能の設定を変更する場合は、エディターの保存時フォーマット(
formatOnSaveMode: "file")とsource.fixAll.oxcのスモークテストを行います。TS の import 整理がオフになっていることも確認します。
実行したチェック、実行しなかったチェック、および残っている 0.x の成熟度や言語サポートに関する前提を報告してください。
コメント
Markdown 対応