JavaScript整形について
バンドル出力、コンソールに貼ったスニペット、レガシーコードからコピーした JS を整えます。「整形」でレビュー用に、「圧縮」で短い貼り付け用文字列にできます。
整形は一貫したインデントと改行を付け、圧縮は実際のパーサを通すため、構文エラーは壊れた出力ではなくエラーとして返ります。
コードレビューでは整形、embed では圧縮が向きます。FAQ では ES モジュール、top-level await、エラー行の読み方も説明しています。
できること
JavaScript 整形
minify 済みや乱れたコードをインデント付きブロックに展開します。関数・オブジェクト・制御構文が行分けされ、parse 可能なスクリプト・モジュール・IIFE で動作します。
JavaScript 圧縮
コメントと不要な空白を除き、実行意味は保ちます。非法構文はエラーとなり、先にソースを直す必要があります。
モジュールと新しめの構文
import/export、async/await、オプショナルチェーン、テンプレートリテラルなど、パーサが受け付ける範囲で整形されます。
オブジェクトとテンプレート文字列
ネストオブジェクトや複数行テンプレートは整形時に折り返されます。古いランタイム向けには末尾カンマに注意してください。
よくある使い方
JavaScript を整形する手順は？
コードを入力欄に貼り「整形」します。関数、波括弧、文がインデントされ、読みやすくデバッグしやすくなります。
minify 済み JS を美化するには？
ビルドや DevTools から 1 行 JS を貼り「整形」します。改行と 2 スペース相当のインデントが戻り、ロジックは変わりません。
JavaScript を短く圧縮するには？
合法な JavaScript を貼り「圧縮」します。コメントと余分な空白が除かれ、コピー可能な compact なスクリプトになります。
よくある質問
- JavaScript を整形する手順は？
- コードを入力欄に貼り「整形」します。関数、波括弧、文がインデントされ、読みやすくデバッグしやすくなります。
- minify 済み JS を美化するには？
- ビルドや DevTools から 1 行 JS を貼り「整形」します。改行と 2 スペース相当のインデントが戻り、ロジックは変わりません。
- JavaScript を短く圧縮するには？
- 合法な JavaScript を貼り「圧縮」します。コメントと余分な空白が除かれ、コピー可能な compact なスクリプトになります。
- 整形と圧縮の違いは？
- 整形は読みやすさのため展開します。圧縮は合法 JS のまま文字数を減らし、実行内容は変えません。
- 圧縮が失敗するのはなぜ？
- 括弧不足、壊れたアロー関数、切れたペーストなど parse エラーです。先に「整形」して問題行を特定してください。
- TypeScript は整形できますか？
- コンパイル後の JavaScript を貼るか、型を除去してください。本ツールは JS を parse し、.ts ソースは IDE や tsc 向きです。
- Terser のような変数名混淆はしますか？
- いいえ。空白とコメントの削除が中心です。mangle や tree shaking はバンドラーの Terser パスで行ってください。