Configure eslint for vue
-
From docs
https://eslint.vuejs.org/user-guide/#how-to-use-a-custom-parser
If you want to use custom parsers such as babel-eslint or @typescript-eslint/parser, you have to use the
parserOptions.parser
option instead of theparser
option. Because this plugin requires vue-eslint-parser to parse.vue
files, this plugin doesn't work if you overwrite theparser
option. npm install --save-dev eslint-plugin-vue vue-eslint-parser
-
Update
.eslintrc.js
- parser: '@typescript-eslint/parser', + parser: "vue-eslint-parser", + // https://github.com/vuejs/vue-eslint-parser#parseroptionsparser + parserOptions: { + parser: "@typescript-eslint/parser", + }, plugins: ['@typescript-eslint'], extends: [ 'eslint:recommended', 'plugin:@typescript-eslint/recommended', + 'plugin:vue/vue3-recommended', 'prettier', ], }
-
Update
package.json
- "lint": "eslint . --ext .js,.jsx,.ts,.tsx" + "lint": "eslint . --ext .js,.jsx,.ts,.tsx,.vue"
Run
npm run lint
Run
npm run format
git add -u
git commit -m 'install eslint-plugin-vue and vue-eslint-parser'
Links
- https://eslint.vuejs.org/user-guide/
- https://eslint.vuejs.org/user-guide/#how-to-use-a-custom-parser
- https://github.com/vuejs/vue-eslint-parser
- https://github.com/vuejs/vue-eslint-parser#parseroptionsparser
Latest comments (3)
After run
npm run lint
, It throw me an error: 4:1 error 'defineProps' is not defined no-undef, what's wrong with my eslint? I have the some config like you.@shenzhongkang Hi, again. Here is proper solution for your problem dev.to/imomaliev/comment/1ihh5
It looks to me like your component file did not import
defineProps
. Do you have a github link to this project?