VSCodeにPrettierを入れる

Visual Studio Codeに、Prettierを導入します。

バージョン情報

• Visual Studio Code: 1.21.1

Prettierとは

JavaScript / TypeScript / CSS を整形してくれるコードフォーマッタです。詳しくはこちら

Prettierのインストール

まずPrettierをインストールします。

npm i -D prettier

VSCodeプラグイン

続いて、PrettierのVSCodeプラグインをインストールします。

VSCodeの拡張機能ボタンをクリックした後、Prettierをインストールしてください。

保存をトリガーに自動フォーマット

保存をするたびに、Prettierを起動してコードのフォーマットを整えるように設定することができます。

VSCodeの [Code] -> [基本設定] -> [設定] を選択して、settings.jsonを開き、"editor.formatOnSave": trueを挿入してください。