🤖
Prettier - Code formatterのメモ
フォーマッターの方針がプロジェクトごとに異なるから
Userの設定を避けて、Workspaceの設定にしてる

該当のプロジェクトに、
方針にないのに、フォーマット設定してたらgit関係でソースコードの差分が出まくって
自分や他人が混乱するし迷惑もかかることがある
だから、要るプロジェクトのときに、毎度、workspace設定する必要があり
その度に、どうやったっけ? ってなるし、メンドイからいい加減書いておくことにした
この記事見て手を動かしたら、一瞬で終わるようにしたい。調べるのメンドイ
Prettier - Code formatterのインストール
esbenp.prettier-vscode
で、拡張機能を検索すると
が出てくる
Prettier (Legacy)
という表記が出てくる(2025/11/29時点)が、これで良いらしい
EditorのDefault FormatterでPrettier - Code formatterを選択する
default formatter で検索して
EditorのDefault FormatterでPrettier - Code formatterを選択する

EditorのFormat On Saveにチェックを入れる
format on save などで検索して
EditorのFormat On Saveのチェックを入れる

必要性があれば、プロジェクトルートに .prettierrcを作る
.prettierrc
の例
{
"tabWidth": 4,
"useTabs": false
}
上記の説明
"tabWidth": 4,
は、
タブキー押したときに、半角スペース4つでインデントする
この値を、2にすべきか、などは、プロジェクトの方針
"useTabs": false
は、タブキーが押したときに、TABが入らないようにする
VS CodeでReload Window
Ctrl+Shift+P(Command+Shift±P)で、
Developper:Reload Window
をして、設定値を反映させる

Discussion