Closed
Description
Checklist
- I have tried restarting my IDE and the issue persists.
- I have read the FAQ and my problem is not listed.
Tell us about your environment
- ESLint version: 8.7.0
- eslint-plugin-vue version: 8.4.0
- Node version: 16.13.2
- Operating System: macOS
Please show your full configuration:
/* eslint-env node */
const path = require("path");
module.exports = {
root: true,
parserOptions: {
parser: "@typescript-eslint/parser",
project: path.resolve(__dirname, "tsconfig.json"),
ecmaVersion: 2018,
sourceType: "module",
extraFileExtensions: [".vue"],
},
plugins: ["@typescript-eslint", "vue"],
extends: ["eslint:recommended", "plugin:vue/vue3-recommended"],
rules: {
"@typescript-eslint/consistent-type-imports": "error",
},
env: {
'vue/setup-compiler-macros': true
}
};What did you do?
Use a Vue component solely as a type in the <script> section and in the <template> section
<script setup lang="ts">
import { ref, onMounted } from "vue";
import MyComponent from "./MyComponent.vue";
type ComponentType = typeof MyComponent extends new () => infer T ? T : never;
const myRef = ref<ComponentType>();
onMounted(() => {
console.log(myRef.value?.printHello)
});
</script>
<template>
<MyComponent ref="myRef" />
</template>What did you expect to happen?
That TypeScript ESLint wouldn't report the @typescript-eslint/consistent-type-imports error, since replacing the import with import type breaks the code:
Without import type:
With import type:
What actually happened?
3:1 error All imports in the declaration are only used as types. Use `import type` @typescript-eslint/consistent-type-imports
✖ 1 problem (1 error, 0 warnings)
1 error and 0 warnings potentially fixable with the `--fix` option.
Repository to reproduce this issue
https://github.com/leonzalion/vue-consistent-type-import-bug