@typescript-eslint/no-unused-vars for variables used in template

[jonnyparris]

Hey Team Nuxt, I'm getting the above errors despite this eslint config and the latest version of @nuxtjs/eslint-config (10.0.0).

module.exports = {
  root: true,
  env: {
    browser: true,
    node: true,
  },
  extends: ['@nuxtjs/typescript', 'prettier'],
  plugins: ['prettier'],
  rules: {},
}

I thought that the vue-parser plugin should be providing the "script-setup-uses-var" functionality that handles this but somehow it doesn't seem to be coming through. Have I missed / misconfigured something?

Simple example page that's offending lint at the moment:

<template lang="pug">
main
  h1 Homepage Title #[Fa(v-show='loading', :icon='["fas", "gear"]', spin)]
</template>

<script setup>
const loading = 'cheese' // <-- lint is convinced this const is unused
</script>

[jonnyparris]

Turns out this was related to the lack of pug parsing in vue-eslint-parser (issue).
Thankfully solved by installing https://github.com/rashfael/eslint-plugin-vue-pug and adding it to eslintrc like so:

module.exports = {
  root: true,
  env: {
    browser: true,
    node: true,
  },
  extends: ['plugin:vue-pug/vue3-recommended', '@nuxtjs/typescript', 'prettier'],
  plugins: ['prettier'],
  rules: {},
}