このツールについて
コードはバンドルから圧縮された形で来ることもあれば、手早い貼り付けで雑然としていることもあり、あなたはその逆を必要とします。このフォーマッターは両方に対応します。HTML・CSS・JavaScript を展開してインデントし読みやすくする整形と、配信のために削ぎ落とす圧縮です。JavaScript の圧縮は Terser、CSS は CSSO が担当——実際のビルドパイプラインで使われる実績あるツールです。
すべてブラウザ内でローカルに動作するので、独自コードも自分のマシンに留まります。言語を選び、整形か圧縮を選んで、結果をコピーしてください。
よくある質問
整形(beautify)と圧縮(minify)は何が違いますか?
整形はインデントと改行を加えてコードを読みやすくします。圧縮は空白やコメントを取り除き、名前を短縮して本番用にファイルをできるだけ小さくします。開発中は整形、公開前は圧縮を使いましょう。
圧縮するとコードの動作が変わりますか?
通常は変わりません。圧縮ツールは意味的に等価であることが証明できる書き換え(ローカル変数のリネーム、デッドコードの削除など)のみを行います。圧縮後に動作が変わった場合、多くは空白に依存した特殊な書き方をしていたか、圧縮ツールのパーサーが実際のバグを検出したことを意味します。
私のコードはどこかにアップロードされますか?
いいえ。整形も圧縮も、一度読み込まれてローカルで実行される JavaScript ライブラリ(js-beautify、Terser、csso)を使い、すべてブラウザ内で行われます。コードがこのページの外に出ることはありません。
このフォーマッターはどの言語に対応していますか?
JavaScript、CSS、HTML に対応しています。JS の圧縮には Terser、CSS の圧縮には csso を使用し、HTML の圧縮は <pre>、<script>、<style> タグの中身を保持する軽量な独自処理です。
整形結果ではなく構文エラーが表示されたのはなぜですか?
フォーマッターは整形・圧縮を行う前にコードを解析するため、実際の構文エラー(対応しない波括弧、余分なカンマなど)は行番号付きで報告され、壊れた出力を黙って生成することはありません。