Encountered an issue where importing a class to be used solely as a typescript type annotation resulted in a no-unused vars error. Following advice from this discussion thread, I added
"plugin:@typescript-eslint/recommended"
appearing onESLint: Parsing error: Identifier expectedv-on:change
showing up onESLint: Parsing error: '}' expected.components: {}within@Component(...)
/App.vue:
<template>
<div id="app" style="height: 100%">
<input v-on:change="onChange"/> <!--This is the "Identifier expected" error -->
</div>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
import Foo from "@/path/to/Foo";
import Bar from "@/path/to/Bar";
@Component({
components: { //This is where the `'}' expected.` error occurs
}
})
export default class App extends Vue {
onChange(e : any) : void {
let f : Foo = Bar.baz(); //This is what caused the "no-unused-vars" problem before
f.someFunc();
}
}
</script>
This snippet contains my Eslint configuration specified in package.json:
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended",
"@vue/typescript",
"plugin:@typescript-eslint/recommended"
],
"parserOptions": {
"parser": "@typescript-eslint/parser"
},
"rules": {}
}
Attempts were made to enable vue/valid-v-on under the rules section, along with other suggestions discussed on GitHub.
Seeking guidance on how best to address this issue.
Thank you for your help.
Edit: I have removed
plugin:@typescript-eslint/recommended"// eslint-disable-next-line no-unused-vars