ESLint is yelling at me for this Prop definition in a Vue single-file component written in Typescript:
@Prop({
default: () => ""
}) Query!: string
Module Warning (from ./node_modules/eslint-loader/index.js): error: Parsing error: Expression expected at ›here‹ 2:4: @Prop({ default: () => "" ^ }) Query!: string
It also complains here:
get RemainingTime() {
if(!this.myData.objectProperty) return nullreturn some_data
}
Module Warning (from ./node_modules/eslint-loader/index.js): error: Parsing error: Expression expected at src/views/list/ProjectBox.vue:79:8: get RemainingTime() { if(!this.myData.objectProperty) return null ^
In my eslint.rc:
parserOptions: {
parser: '@typescript-eslint/parser',
}
What expression is expected here -- or what else causes the linter error?
I’m happy to provide further information, but since I’m unfamiliar with the technology stack I don’t know what to include—and I don’t want to dump each configuration file here. The project was setup using vue-cli.
In the first code snippet, the issue is with the TypeScript type assertion operator !. It should be placed after the property name, like this:
@Prop({ default: () => "" }) Query: string!In the second code snippet, the issue is with the get keyword, which is used to define a getter in a class. It should be removed, like this:
get RemainingTime() { if(!this.myData.objectProperty) return nullreturn some_data }The @typescript-eslint/parser is a parser that converts TypeScript code into an abstract syntax tree (AST) that can be used by the ESLint linter. It is designed to work with the @typescript-eslint/eslint-plugin plugin, which provides linting rules for TypeScript code.
To configure the parser and plugin in your .eslintrc file, you can use the following configuration:
{ "parserOptions": { "parser": "@typescript-eslint/parser" }, "plugins": [ "@typescript-eslint" ] }You may also want to consider using the eslint-plugin-vue plugin, which provides linting rules specific to Vue.js single-file components. To use this plugin, you would need to add it to the plugins array in your .eslintrc file and configure any rules that you want to use.