TypeScript フォーマッター - TSをオンラインで整形・美化
TypeScriptコードをオンラインで整形・美化。可読性を向上させます。無料、ブラウザで動作—データはサーバーに送信されません。
入力
出力
TypeScriptフォーマッターとは？
TypeScriptフォーマッターはTypeScriptコードを一貫したインデント、適切なスペース、読みやすい形に再整理します。インターフェース、クラス、関数、型アノテーション、ジェネリクスなどすべてのTypeScript構文を処理します。
このツールには2つのモードがあります：フォーマット（美化）とミニファイ（圧縮）。両方ともブラウザで動作し、コードはサーバーに送信されません。
このツールの使い方
モードを選択
フォーマットでTypeScriptコードを美化するか、ミニファイで圧縮します。
入力を貼り付け
TypeScriptコードを左のエディターに貼り付けます。サンプルまたはアップロードも使用できます。
結果をコピー
右のパネルは自動的に更新されます。<strong>コピー</strong>または<strong>ダウンロード</strong>で結果を保存します。JavaScriptをTypeScriptに変換するには、JSをTypeScriptにをお試しください。
TypeScriptフォーマッターの例
インターフェース付きTypeScriptクラスのフォーマット前後:
フォーマット前のTypeScript
フォーマット後のTypeScript
フォーマットが重要な場面
一貫したコードフォーマットはコードを読む際の認知負荷を減らし、プルリクエストのレビューを容易にします。TypeScriptプロジェクトではPrettierやESLintが自動フォーマットに使用されます。
ミニファイは本番ビルドのバンドルサイズ削減に使用されます。完全なTypeScriptコンパイルには、TypeScriptコンパイラやバンドラーを使用してください。
よくある質問
すべてのTypeScript機能をサポートしていますか？
このツールはほとんどのTypeScriptコードに対応する波括弧ベースのインデントフォーマッターを使用します。本番環境ではPrettierをご検討ください。
コードはどこかに送信されますか？
いいえ。フォーマットは完全にブラウザ内で実行されます。
ミニファイは何をしますか？
ミニファイはコメントを削除し、空白を圧縮してファイルサイズを削減します。
.tsxファイルをフォーマットできますか？
はい。TSXも同じ波括弧ベースの構造に従い、正しくフォーマットされます。
JSフォーマッターとどう違いますか？
TypeScriptフォーマッターはTypeScript構文ハイライトを使用し、TypeScript固有の構文に最適化されています。
関連ツール
TypeScriptドキュメント。Prettierはフォーマットの業界標準です。ESLintはフォーマットルールを含むリンティングを提供します。