场景
vue component: () => import("@/views/login/index.vue"), 原因：Ts默认不识别.vue文件。 解决办法：添加类型声明文件，创建一个后缀名为.d.ts的文件，例如env.d.ts，并配置如下内容即可： vue declare module "*.vue" { import { DefineComponent } from "vue"; // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types const component: DefineComponent<{}, {}, any>; export default component; }
注意：env.d.ts文件具体放置在哪里会生效和配置有关。
- 如果项目结构中包含
tsconfig.app.json和tsconfig.node.json文件， 则打开tsconfig.app.json文件会发现有一个include配置项，默认内容如下：json "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue"]可以看到include配置项对应的数组中有"src/**/*.ts"配置，它将会扫描src目录及其所有子目录下以.ts结尾的文件，所以会发现把env.d.ts文件放置在src目录下会生效，而放置在项目根目录下不会生效。是因为只要添加了include配置项，哪怕对应的是空数组也以配置为准，如果想要放置在项目根目录下也生效，有两种做法 + 把include配置项去掉（记住是去掉配置项，而不是去掉include配置项里的配置值src/**/*.ts），去掉后文件放在项目根目录下任意位置都能匹配到（前提文件不能被<font style="color:rgba(0, 0, 0, 0.85);">exclude</font>选项排除）。 + 在include配置项数组中再添加根目录配置"*.d.ts"即可，如下所示。json "include": ["src/**/*.ts","*.d.ts", "src/**/*.tsx", "src/**/*.vue"] } - 如果项目结构中不包含
tsconfig.app.json和tsconfig.node.json文件，则看tsconfig.json有没有配置项include，若有则以include配置为准，若没有则放置在项目根目录下任意位置都能匹配到（前提文件不能被<font style="color:rgba(0, 0, 0, 0.85);">exclude</font>选项排除）
