Vue3でVSCodeのformatOnSaveみたいなのをESLintの設定でやる

Vue3のプロジェクトを作成して、そのままだとコマンドラインで npm run lint しないとできませんでした。

VSCode側の editor.formatOnSave ってやつもあるんですが、そっちで自動フォーマットするとVueのほうで設定してある ESLint とは違った形でフォーマットされてしまいます。

頑張ってかなりググった結果、以下のようにVSCodeのsetting.jsonを書けば実現できました。

{
  "editor.codeActionsOnSave": {
    "source.fixAll": true,
  },
}

この辺の設定、ぐぐると昔の記事がたくさん出てきて、ことごとく現在の設定方法と異なっているので地味に時間かかりました。