fixtures/input/vue-ts.vue

@@ -12,7 +12,7 @@
 import { ref } from 'vue';
 
 const greeting = ref('Hello, Vue 3!');
-let counter = ref<number  | string>(0);
+let counter = ref<number  | 1>(0);
 
 // Define a function
 const incrementCounter = () => {

fixtures/input/vue.vue

@@ -13,9 +13,12 @@ import { ref  } from '@vue/reactivity';
 
 const greeting = ref('Hello, Vue 3!' + 1);
 let counter = ref(0)
+let doubled = computed(() => counter.value * 2);
 
 // Define a function
 const incrementCounter = () => {
   counter.value++;
 };
+
+let _zero = doubled + counter
 </script>

fixtures/output/all/vue-ts.vue

@@ -3,7 +3,7 @@
 import { ref } from 'vue'
 
 const greeting = ref('Hello, Vue 3!')
-const counter = ref<number | string>(0)
+const counter = ref<number | 1>(0)
 
 // Define a function
 function incrementCounter() {

fixtures/output/all/vue.vue

@@ -4,11 +4,14 @@ import { ref } from 'vue'
 
 const greeting = ref(`Hello, Vue 3!${1}`)
 const counter = ref(0)
+const doubled = computed(() => counter.value * 2)
 
 // Define a function
 function incrementCounter() {
   counter.value++
 }
+
+const _zero = doubled.value + counter.value
 </script>
 
 <template>

fixtures/output/no-style/vue-ts.vue

@@ -3,7 +3,7 @@
 import { ref } from 'vue';
 
 const greeting = ref('Hello, Vue 3!');
-const counter = ref<number  | string>(0);
+const counter = ref<number  | 1>(0);
 
 // Define a function
 const incrementCounter = () => {

fixtures/output/no-style/vue.vue

@@ -4,11 +4,14 @@ import { ref  } from 'vue';
 
 const greeting = ref(`Hello, Vue 3!${  1}`);
 const counter = ref(0)
+const doubled = computed(() => counter.value * 2);
 
 // Define a function
 const incrementCounter = () => {
   counter.value++;
 };
+
+const _zero = doubled.value + counter.value
 </script>
 
 <template>

fixtures/output/tab-double-quotes/vue-ts.vue

@@ -3,7 +3,7 @@
 import { ref } from "vue"
 
 const greeting = ref("Hello, Vue 3!")
-const counter = ref<number | string>(0)
+const counter = ref<number | 1>(0)
 
 // Define a function
 function incrementCounter() {

fixtures/output/tab-double-quotes/vue.vue

@@ -4,11 +4,14 @@ import { ref } from "vue"
 
 const greeting = ref(`Hello, Vue 3!${1}`)
 const counter = ref(0)
+const doubled = computed(() => counter.value * 2)
 
 // Define a function
 function incrementCounter() {
 	counter.value++
 }
+
+const _zero = doubled.value + counter.value
 </script>
 
 <template>

fixtures/output/ts-override/vue-ts.vue

@@ -3,7 +3,7 @@
 import { ref } from 'vue'
 
 const greeting = ref('Hello, Vue 3!')
-const counter = ref<number | string>(0)
+const counter = ref<number | 1>(0)
 
 // Define a function
 function incrementCounter() {

fixtures/output/ts-override/vue.vue

@@ -4,11 +4,14 @@ import { ref } from 'vue'
 
 const greeting = ref(`Hello, Vue 3!${1}`)
 const counter = ref(0)
+const doubled = computed(() => counter.value * 2)
 
 // Define a function
 function incrementCounter() {
   counter.value++
 }
+
+const _zero = doubled.value + counter.value
 </script>
 
 <template>

fixtures/output/with-formatters/vue-ts.vue

@@ -3,7 +3,7 @@
 import { ref } from 'vue'
 
 const greeting = ref('Hello, Vue 3!')
-const counter = ref<number | string>(0)
+const counter = ref<number | 1>(0)
 
 // Define a function
 function incrementCounter() {

fixtures/output/with-formatters/vue.vue

@@ -4,11 +4,14 @@ import { ref } from 'vue'
 
 const greeting = ref(`Hello, Vue 3!${1}`)
 const counter = ref(0)
+const doubled = computed(() => counter.value * 2)
 
 // Define a function
 function incrementCounter() {
   counter.value++
 }
+
+const _zero = doubled.value + counter.value
 </script>
 
 <template>

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@antfu/eslint-config",
   "type": "module",
-  "version": "2.8.0",
+  "version": "2.8.1",
   "packageManager": "pnpm@8.15.4",
   "description": "Anthony's ESLint config",
   "author": "Anthony Fu <anthonyfu117@hotmail.com> (https://github.com/antfu/)",
@@ -92,24 +92,24 @@
     "@eslint-types/typescript-eslint": "^7.0.2",
     "@eslint-types/unicorn": "^51.0.1",
     "@stylistic/eslint-plugin": "^1.6.3",
-    "@typescript-eslint/eslint-plugin": "^7.1.1",
-    "@typescript-eslint/parser": "^7.1.1",
+    "@typescript-eslint/eslint-plugin": "^7.2.0",
+    "@typescript-eslint/parser": "^7.2.0",
     "eslint-config-flat-gitignore": "^0.1.3",
     "eslint-merge-processors": "^0.1.0",
     "eslint-plugin-antfu": "^2.1.2",
     "eslint-plugin-eslint-comments": "^3.2.0",
     "eslint-plugin-i": "^2.29.1",
-    "eslint-plugin-jsdoc": "^48.2.0",
+    "eslint-plugin-jsdoc": "^48.2.1",
     "eslint-plugin-jsonc": "^2.13.0",
-    "eslint-plugin-markdown": "^3.0.1",
+    "eslint-plugin-markdown": "^4.0.1",
     "eslint-plugin-n": "^16.6.2",
     "eslint-plugin-no-only-tests": "^3.1.0",
-    "eslint-plugin-perfectionist": "^2.5.0",
+    "eslint-plugin-perfectionist": "^2.6.0",
     "eslint-plugin-toml": "^0.9.2",
     "eslint-plugin-unicorn": "^51.0.1",
     "eslint-plugin-unused-imports": "^3.1.0",
-    "eslint-plugin-vitest": "^0.3.22",
-    "eslint-plugin-vue": "^9.22.0",
+    "eslint-plugin-vitest": "^0.3.25",
+    "eslint-plugin-vue": "^9.23.0",
     "eslint-plugin-yml": "^1.12.2",
     "eslint-processor-vue-blocks": "^0.1.1",
     "globals": "^14.0.0",
@@ -130,7 +130,7 @@
     "@stylistic/eslint-plugin-migrate": "^1.6.3",
     "@types/eslint": "^8.56.5",
     "@types/fs-extra": "^11.0.4",
-    "@types/node": "^20.11.24",
+    "@types/node": "^20.11.26",
     "@types/prompts": "^2.4.9",
     "@types/yargs": "^17.0.32",
     "@unocss/eslint-plugin": "^0.58.5",
@@ -157,7 +157,7 @@
     "svelte": "^4.2.12",
     "svelte-eslint-parser": "^0.33.1",
     "tsup": "^8.0.2",
-    "typescript": "^5.3.3",
+    "typescript": "^5.4.2",
     "vitest": "^1.3.1",
     "vue": "^3.4.21"
   },

src/configs/vue.ts

@@ -34,6 +34,26 @@ export async function vue(
 
   return [
     {
+      // This allows Vue plugin to work with auto imports
+      // https://github.com/vuejs/eslint-plugin-vue/pull/2422
+      languageOptions: {
+        globals: {
+          computed: 'readonly',
+          defineEmits: 'readonly',
+          defineExpose: 'readonly',
+          defineProps: 'readonly',
+          onMounted: 'readonly',
+          onUnmounted: 'readonly',
+          reactive: 'readonly',
+          ref: 'readonly',
+          shallowReactive: 'readonly',
+          shallowRef: 'readonly',
+          toRef: 'readonly',
+          toRefs: 'readonly',
+          watch: 'readonly',
+          watchEffect: 'readonly',
+        },
+      },
       name: 'antfu:vue:setup',
       plugins: {
         vue: pluginVue,