コード整形ツール
コードを貼り付けるかファイルを開いて「整形」を押すだけ。言語は自動で判定されます。JavaScript、TypeScript、CSS、HTML、JSON、XML、SQL、YAML、Markdown、GraphQL に対応し、すべてブラウザ内で処理します。
すべてブラウザ内で処理され、コードがサーバーに送信されることはありません。
行の幅は JavaScript、TypeScript、CSS、SCSS、LESS、HTML、YAML、Markdown、GraphQL に適用されます。整形で、ロジック・型・スタイルルールがチェックされることはありません。
コードを入力すると言語を自動で判定します。
コードファイル(5 MBまで)をここにドロップするか、貼り付け・サンプル読み込みができます。Ctrl+Enter で整形します。
ブラウザでコードを整形して読みやすくする
圧縮されたバンドル、ログ、チャットのメッセージ、古いプロジェクトからコピーしたコードは、読みづらく、レビューはさらに大変です。このコード整形ツールなら、ワンクリックでインデントの揃った読みやすいテキストに戻せます。コードを貼り付けて「整形」(または Ctrl+Enter)を押すと、元のコードの隣に結果が表示されます。両側に行番号があるので、ひと目で見比べられます。
開発者がよく扱う形式を一通りカバーしています。JSX を含む JavaScript、TSX を含む TypeScript、CSS・SCSS・LESS、インラインのスクリプトやスタイルを含む HTML、JSON、XML、13種類の方言に対応した SQL、YAML、Markdown、GraphQL です。言語は基本的に自動で判定され、ファイルを開いたときはファイル名から、貼り付けたときはテキストの内容から判断します。複数の言語に見えるテキストの場合は、黙って誤ったパーサーを選ぶのではなく、その旨をお知らせして有力な候補を提示します。
スタイルは自由に選べます。インデントはスペース2つ、スペース4つ、タブから選択でき、Prettier で整形する言語では行の幅を80・100・120文字から選べます。SQL では PostgreSQL、MySQL、SQL Server、BigQuery などの方言を指定できます。JSON には「JSONを圧縮」ボタンもあり、数値・文字列・キーの順序には手を加えず、空白だけをすべて取り除きます。設定はブラウザに保存されます。入力しながら結果を見たい場合は、自動整形をオンにしてください。
問題があったときのメッセージは、短く正確です。言語、パーサーが期待していたもの、行と列を示します。入力が上書きされることはなく、ボタンひとつで問題の箇所にカーソルが移動します。誤ってクリアしたり置き換えたりした内容は「元に戻す」で復元できます。結果は言語に合った拡張子でダウンロードでき、テキスト差分比較で2つのバージョンを左右に並べて、何が変わったのかを正確に確認することもできます。
処理はすべてお使いの端末上で行われます。負荷の大きい整形エンジンは、実際に整形する言語の分だけダウンロードされ、バックグラウンドのワーカーで動くため、大きなファイルでもページが固まりません。制限もあります。開けるファイルは5 MBまで、30万文字を超える入力は数秒かかることがあり、200万文字を超える入力は受け付けません。整形はリンターでもコンパイラーでもないため、ロジックの誤りは見つけられず、ごく特殊な構文は受け付けられない場合があります。
よくある質問
コードはどこかにアップロードされますか?
いいえ。コードはブラウザ内、しかもバックグラウンドのスレッドで動くライブラリが整形します。サーバーには何も送信されません。このブラウザのローカルストレージに保存されるのは設定と、任意の下書きだけです。入力欄はいつでも空にできます。
整形するとコードの動作は変わりますか?
変わるのは見た目だけです。インデント、改行、空白が整います。引用符の統一、省略可能な括弧の追加や削除、セミコロンの揃えも行いますが、意味は変わりません。ロジック・型・lintルールはチェックしないため、正しいコードは正しいまま、誤ったコードは誤ったまま出力されます。
言語はどのように判定されますか?
ファイルを開いた場合は拡張子で決まります。それ以外は、タグ、波括弧、キーワード、特徴的な記号などテキストそのものから判断します。CSS と SCSS、JavaScript と TypeScript のように似ている言語は、推測せずに選択をお願いします。「言語」の一覧から手動で選ぶこともいつでもできます。
構文エラーがあるとどうなりますか?
出力は空のままで、入力はそのまま残り、行と列を示す短いメッセージが表示されます。「入力欄で表示」ボタンで該当箇所に移動し、修正してもう一度「整形」を押してください。
ここでコードを圧縮(minify)できますか?
圧縮できるのはJSONのみで、空白を取り除いても常に安全です。JavaScript や CSS を正しく圧縮するには専用のツールが必要です。変数名の変更やルールの統合で動作が変わる恐れがあるため、このツールでは行いません。SQLの構文をより詳しく確認したい場合は、SQL整形・構文チェックをご利用ください。