[VSCode]Vueコード整形ツールの設定をシングルクォーテーションにする

VSCodeでVueのコード整形ツール(Prettier)の設定をシングルクォーテーションにしたい。

問題

古い記事では、以下のように書かれていることが多かった。

メニューから Code > Preference > Settings を開く。
検索バーで SingleQuote と検索して出てきたものをチェック。

自分の環境ではこの設定を行なっても整形時にダブルクォーテーションのままだった。

解決策

Pritterはアップデートがあったらしく、共通の設定ファイルを利用せずにPritter専用ファイルから指定するよう変更されたらしい。

プロジェクトルートディレクトリに.prettierrcを作成して以下を記述する。

{
  "singleQuote": true
}

これでフォーマッターのショートカット Shift+Option+F を押すと、シングルクォーテーションで整形されるようになった。

参考

https://stackoverflow.com/questions/59243558/vscode-not-formatting-ts-js-files-with-single-quotes
https://prettier.io/docs/en/configuration.html