コードビューティファイアー
定評あるフォーマッターで、14 言語のコードを統一された書式に整形します。JavaScript、TypeScript、HTML、CSS、SQL、PHP、Python などに対応し、ブラウザ内で動作します。
すべてブラウザ内で実行されます。データがアップロードされることはありません。
関連ツール
すべて表示コードビューティファイアーとは?
コードビューティファイアーは、1 つのページで多くの言語のソースコードを整形します。言語とインデントを選ぶと、定評あるフォーマッター(Prettier、Ruff、sql-formatter、xml-formatter)により、統一された形式のコードが得られます。
コードビューティファイアーの使い方
- 言語 を選びます。
- インデント を選びます。
- コードを貼り付けて 整形 をクリックします(ほとんどの言語では入力中にも更新されます)。
- 結果をコピーまたはダウンロードします。
例
const a={b:1,c:[1,2]} const a = { b: 1, c: [1, 2] }; 言語:JavaScript、スペース 2 つ。
コードビューティファイアーを使うべき場面
ツールを持っていない言語のコードを手早く整形したり、ドキュメント用にスニペットを整形したりするときに使います。プロジェクトでは、出力が一貫するよう、エディターや CI で同じフォーマッターを設定してください。整形でロジックのエラーが直ることはありません。
コードビューティファイアーの仕組み
選択した言語によってエンジンが決まります。JavaScript(Babel パーサー)、TypeScript、HTML、CSS、SCSS、Less、YAML、GraphQL、Markdown、PHP(@prettier/plugin-php)には Prettier 3、JSON には厳密な JSON プリンター、XML には xml-formatter、SQL には sql-formatter(標準 SQL、大文字のキーワード)、Python には WebAssembly にコンパイルされた Ruff を使います。エンジンは初めて使うときにだけダウンロードされます。構文エラーは、エンジンが提供する場合は行と列付きで報告されます。
一般的な使用例
- Prettier をインストールせずに TypeScript のスニペットを整形する
- チャットや PDF からコピーしたコードを整える
- Markdown の表やリストを整形する
- コードのインデントをスペース 2 つと 4 つの間で切り替える
セキュリティ注意事項
すべてブラウザ内でローカルに処理され、貼り付けたコードがアップロードされることはありません。
よくある質問
JavaScript の整形にはどのスタイルが使われますか?
Prettier の既定値で、ダブルクォート、セミコロン、80 文字の行です。
Python が初回に遅いのはなぜですか?
Ruff の WebAssembly エンジンが初回の使用時にダウンロードされるためです。
SQL の方言を選べますか?
方言やキーワードの大文字・小文字のオプションは、SQL フォーマッターのページを使ってください。