无法找到模块“*.vue”的声明文件

加一个 Vue 通配声明文件（最标准，一劳永逸！）

在项目根目录（或 src/types/ 下）新建一个文件，叫 vue.d.ts 或 shims-vue.d.ts：

文件名随便，但后缀必须是 .d.ts

推荐路径：src/shims-vue.d.ts 或 types/vue.d.ts 或直接根目录 vue.d.ts

/// <reference types="vite/client" />

declare module '*.vue' {
  import type { DefineComponent } from 'vue';
  const component: DefineComponent<{}, {}, any>;
  export default component;
}

const component: DefineComponent<{}, {}, any>; 这行可以让 <script setup> 的类型推导更智能（Vue 3.3+）

然后确保 tsconfig.json 包含了它（一般默认就包含）：

{
  "include": [
    "src/**/*.ts",
    "src/**/*.d.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "*.d.ts",                 // 加这行就万无一失
    "src/shims-vue.d.ts"      // 或者明确写路径
  ]
}

保存 → 重启 VS Code（Ctrl+Shift+P → Reload Window） → 所有 .vue 文件导入红线瞬间消失！

/// <reference types="vite/client" />

这行不是必须的，但建议也加上去

这行是 TypeScript 的三斜杠指令，作用是把 Vite 官方自带的类型声明一次性全部导入进来，里面包含了下面这些你平时“看不见但一直在用”的类型：

具体解决了什么问题（不加会报红/没提示）	例子
import.meta.env.xxx 的类型提示	import.meta.env.VITE_APP_TITLE
import xxx from '*.png' / *.svg 等静态资源的类型	import logo from '@/assets/logo.png'
defineProps() / defineEmits() 在 <script setup> 里的完整类型推导	props: { msg: String }
.vue 文件的正确类型（和 declare module '*.vue' 一起用）	-
ref() 自动脱 ref（Vue 3.4+ 的新特性）等	-