[Vue.js]<script setup>形式のESLintのベストプラクティスを知りたい

そろそろ本格的にVue.jsを<script setup>の形式で書くようにしようと思う今日この頃(Composition API自体まともに使ったことないですが)

ただ、いろいろググってESLintの指定方法を調べても、どうにもしっくりこない。「defineProps’ is not defined.」というエラーが表示されたり、「no-var」が有効になっておらず、varで変数定義できてしまったり(ここは人によるだろうけど、個人的にはno-varは必須)。

いろいろ試してみた結果、ESLintの設定は下記のような記述で落ち着きました(.eslintrc.yml)。

env:
  browser: true
  es2021: true
  'vue/setup-compiler-macros': true
extends:
  - 'airbnb-base'
  - 'plugin:vue/vue3-recommended'
  - 'eslint:recommended'
  - '@vue/typescript/recommended'
  - 'eslint-config-prettier'
parserOptions:
  ecmaVersion: latest
  parser: '@typescript-eslint/parser'
  project: ./tsconfig.json
plugins:
  - vue
  - '@typescript-eslint'
rules:
  'no-console': 'off'

「env」に「’vue/setup-compiler-macros’: true」を追加することで、「defineProps’ is not defined.」というエラーは消えます。
「’no-var’: ‘error’」とrulesで指定しようか迷ったけど、よく使われている「airbnb-base」で定義することにしました。ただ、これだとconsole.logが使えなくなるので、「’no-console’: ‘off’」と追加。使っていって、あわないエラーがあったらオフにしていこうと思う。

package.jsonは下記のような感じ。

{
  "name": "vite-test",
  "private": true,
  "version": "0.0.0",
  "scripts": {
    "dev": "vite",
    "build": "vue-tsc --noEmit && vite build",
    "preview": "vite preview",
    "lint": "eslint --fix src/*.{ts,vue} && eslint --fix src/**/*.{ts,vue}"
  },
  "dependencies": {
    "vue": "^3.2.25"
  },
  "devDependencies": {
    "@typescript-eslint/eslint-plugin": "^5.21.0",
    "@typescript-eslint/parser": "^5.21.0",
    "@vitejs/plugin-vue": "^2.3.1",
    "@vue/eslint-config-typescript": "^10.0.0",
    "eslint": "^8.14.0",
    "eslint-config-airbnb": "^19.0.4",
    "eslint-config-prettier": "^8.5.0",
    "eslint-plugin-vue": "^8.7.1",
    "prettier": "^2.6.2",
    "typescript": "^4.5.4",
    "vite": "^2.9.5",
    "vue-tsc": "^0.34.7"
  }
}

実はいうと、いろんなページを参考にとりあえず追加していったため、どのライブダリがどの設定に対応しているのかいまいち分かってないです。多分、不必要なライブラリはないと思います。
というよりも、ESLintの設定自体よく分かってないです。このへんの設定はいっつも迷うなぁ。
とりあえずコード書いていって、いまいちだと思ったらまた設定を変更していくことにしようと思います。