Solution: when using Vue 3 script setup, eslint reports the error ‘defineprops’ is not defined
Vue 3’s script setup syntax introduces compiler macros of defineprops, definemits, defineexpose, withdefaults. However, in some cases, eslint will report an error. The above compiler macro functions are not defined.
This article will introduce two solutions to solve this problem (assuming that your project is initialized with Vue CLI).
Step 1. Check the version of eslint-plugin-Vue
npm list eslint-plugin-vue
If the version is in V8 Above 0.0, jump to step 2, otherwise go directly to the content of step 3.
Step 2. Version is V8.0.0+
Open eslintrc.JS file and modify it as follows:
env: {
node: true,
// The Follow config only works with eslint-plugin-vue v8.0.0+
"vue/setup-compiler-macros": true,
},
Step 3. Version is V8 Below 0.0
Open eslintrc.JS file and modify it as follows:
// The Follow configs works with eslint-plugin-vue v7.x.x
globals: {
defineProps: "readonly",
defineEmits: "readonly",
defineExpose: "readonly",
withDefaults: "readonly",
},
If your version of
eslint-plugin-vueis under V8, I don’t recommended you to upgrade the version，especially you had used a lot of ts dependency.
