vite使用TS时，路由懒加载路径报红，找不到模块

若酿

已于 2024-08-23 11:05:11 修改

阅读量231

点赞数 6

文章标签：前端 typescript javascript

于 2024-08-22 19:32:07 首次发布

本文链接：https://blog.csdn.net/weixin_55695389/article/details/141436154

版权

在创建vue3的vite项目时，使用typescript开发，第一次使用路由懒加载时，出现如下的情况：

这里的路径报红，同时main.ts文件中的import App from './App.vue'路径也报红，但是不影响程序的正常运行。想要解决波浪线报红，只需要在src/vite-env.d.ts文件下添加如下代码：

/// <reference types="vite/client" />
// 配置这个文件是 解决错误：找不到模块“@/views/Login.vue”或其相应的类型声明。ts(2307)
// 这段代码告诉 TypeScript，所有以 .vue 结尾的文件都是 Vue 组件，可以通过 import 语句进行导入。这样做通常可以解决无法识别模块的问题。
declare module "*.vue" {
    import { Component } from "vue";
    const component: Component;
    export default component;
}