搭建 vue3+ts 项目的时候遇到的一个问题:找不到模块“@/views/score.vue”或其相应的类型声明
虽然说爆红是不影响运行的,但这谁看这都难受啊!
原因:因为我们使用的是 ts 的语法,项目只识别 ts 后缀的文件,无法识别 .vue 文件,所以引入的时候会报错,需要申明一下
参考连接:https://cn.vuejs.org/guide/typescript/overview.html#using-vue-with-typescript
解决办法:
- 利用插件 TypeScript Vue Plugin 解决
TIP:
- Volar 是官方的 VSCode 扩展,提供了 Vue 单文件组件中的 TypeScript 支持
- Volar 取代了我们之前为 Vue 2 提供的官方 VSCode 扩展 Vetur。如果你之前已经安装了 Vetur,请确保在 Vue 3 的项目中禁用它。
- 在src目录下创建env.d.ts文件,加入以下代码 目的:在导入以
.vue 结尾的模块时,应该使用下面的定义。
declare module "*.vue" { import type { DefineComponent } from "vue"; const component: ComponentOptions | ComponentOptions["setup"]; export default component; }
解决!