Prettier コードフォーマッターとは?
Prettier コードフォーマッターは、公式の Prettier standalone パイプラインを ブラウザ内で直接実行し、コードをサーバーに送らずにソースファイルを 整形できます。すばやく整形したいとき、さまざまな行幅設定を比較したいとき、 あるいはすぐにコピーやダウンロードできるきれいなファイルが欲しいときに便利です。
対応フォーマット
この rewrite では、Prettier がブラウザで安定して扱える形式に絞って対応しています。対象は JavaScript、JSX、TypeScript、TSX、Flow、各種 JSON、HTML、XML、CSS、PostCSS、SCSS、Less、Markdown、MDX、YAML、GraphQL、そして Angular、Vue、Svelte、LWC、MJML、Handlebars のようなテンプレート形式です。言語セレクターで使うパーサーを切り替えられ、拡張子が認識できるファイルを読み込んだ場合は自動で判定します。
この rewrite の仕組み
この rewrite では、重い整形ロジックをメインの UI パスから切り離しています。
整形リクエストは tool ローカルの純粋な設定から組み立て、必要になったときだけ
worker 経由で Prettier を動かすので、通常の入力操作は軽快なままです。
入力が大きい場合は自動整形を止めて、明示的な 今すぐ整形 アクションに切り替えます。
その方が、毎キー入力ごとに巨大なファイルを再整形するよりも予測しやすくなります。