VScodeでのprettierの設定

3月 19, 2021

動作環境　Mac MacBook Pro (Retina, 15-inch, Mid 2014)
VScode
Prettier

Prettierが動かない

Code > Preferences > Setting から [onsave]と検索します。
Editor:Format On Saveにチェックを付ければファイルを保存したときにPrettierが動きます。

それでもPrettierが動かない

Code > Preferences > Setting から [formatter]と検索します。
Editor: Default Formatterの選択リストでesbenp.prettier-vscodeを選択します。
これでJavascriptのファイルを保存したときにPrettierが動きます。

Prettierが動かない

Code > Preferences > Setting から [prettier]と検索します。
Prettier: Prettier Path
Path to the prettier moduleのところにprettierのmoduleのpathを入力します。

/Users/[ユーザー名]/.nodebrew/node/v12.15.0/bin　　　　　　　 ← 正解
/Users/[ユーザー名]/.nodebrew/node/v12.15.0/bin/prettier    ← 失敗

正しく入力すると、Javascriptファイルを保存したときにコードが整形されます。

その他

prettierのバージョンを確認する

prettier -v
2.2.1

コマンドラインから以下のコマンドを入力してもPrettierが起動してファイルが整形されることを確認出来ます。

prettier --write ファイルのパス