eslint-plugin-vue の vue/no-unused-properties

🤔 setup 関数内で return してるけど template 内で使用していないものがあるときの警告とか esLint or Vetur で出せたりしないかな？

— Yuji Tsuburaya (@___35d) September 29, 2021

Yuji Tsuburaya さんのツイートを見て「たしかに」と思い、ちょっと調べてみた。

vue/no-unused-properties | eslint-plugin-vue

とりあえず eslint-plugin-vue に該当項目ないかな〜と眺めて、項目が多すぎてわからん！となったので、それっぽいワードで grep した。たしかunusedで調べて引っかかったやつを見ていったと思う。あとsetupも調べた。

で、それっぽいのが出てきたので「これどうですか！？」と丸投げしてしまった。Tsuburaya さんすみません:bow:

自分でも試してみたらスッとできた。

rules: {
  'vue/no-unused-properties': [
    'error',
    {
      groups: ['props', 'setup'],
    },
  ],
},

これで、setup 内で定義されているが template で使われていないプロパティが怒られるようになり、props で定義されているが setup 内もしくは template で使われていないものも怒られるようになった。

意外と便利だしすぐに導入できるし汎用性が高いので仕事のリポジトリにも追加しようと思う。