关于在vite路由使用路由出现红色下划线爆红解决办法

1.出现的问题

image.png
2.解决办法
在src文件夹下新建
shims-vue.d.ts文件 输入
declare module '.vue' {
import { DefineComponent } from 'vue';
const component: DefineComponent<{}, {}, any>;
export default component;
}
保存，这个文件告诉 TypeScript 如何处理 .vue 文件，使其能够正确推断出组件的类型。同时确保确保 TypeScript 配置正确自行查看配置文件确保你的 tsconfig.json 文件包含以下配置：
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@/": ["src/"]
},
"esModuleInterop": true,
"module": "esnext",
"target": "esnext",
"moduleResolution": "node",
"jsx": "preserve",
"sourceMap": true,
"strict": true,
"noImplicitAny": false,
"strictNullChecks": true,
"resolveJsonModule": true,
"lib": ["esnext", "dom"]
},
"include": ["src//.ts", "src//.d.ts", "src//.tsx", "src/*/.vue"]
}

保存就可以route.ts不在爆红

image.png