【VSCode】 「Prettier」のコード整形を「手動」で実行する

こんにちは、さち です。

普段、ウェブサイトを作るときは「Visual Studio Code（以下：VSCode）」を使っています。動作が軽く色々な機能も追加できるのに、無料で利用できる最強のコードエディターアプリです。

今回は、この VSCode の拡張機能「Prettier」を使って、コードの整形を「手動」で実行する方法について書いていきます。

操作手順

1. コードを自動整形できる拡張機能「Prettier」をインストール済みの状態です。
   
2. 1行になっている（minify された）このコードを「整形」してみましょう。
   
3. 「コマンドパレット（ Ctrl + Shift + P ）」を開いて、format document と入力。「ドキュメントのフォーマット」を選んで実行します。
   
4. コードを「整形」できました。
   

例では CSS を整形しましたが、「Prettier」が対応している「言語」なら他のものでも大丈夫です。