1.vite+vue3+ts项目中提示无法找到模块
一.首先产生这个错误是:无法找到模块XXX,并且提示'XXX' is declared but its value is never read
二. 产生这个问题的原因是我们使用了ts语法,他只能识别.ts文件,并不能识别.vue文件,所以在引入组件的时候报错了。
解决方案在在项目的根目录下创建一个vite-env.d.ts文件,文件名自定义即可,后缀必须是.d.ts
在刚刚创建的文件中输入一下代码
declare module '*.vue' {
import { ComponentOptions } from 'vue'
const componentOptions: ComponentOptions
export default componentOptions
}
2. TS 报错 Could not find a declaration file for module 'XX' --找不到模块的声明文件xx
解决方案在vite-env.d.ts文件声明:
declare module 'xx'
3. 在ts环境下报Cannot find module 'pinna' or its corresponding type declarations
解决方案安装:npm install -D @types/node
如果问题还没有解决,就打开tsconfig.json文件,确保types中含有"node"。
{
"compilerOptions": {
"types": [
"node"
]
},
}
最重要,重启VSCODE,重新打开项目
4.TS 报错Cannot find module 'vue'. Did you mean to set the 'moduleResolution' option to 'node', or to add ali
->翻译过来是找不到 vue模块 需要将 moduleResolution设置成node
解决方案在找到 tsconfig.json 文件
"compilerOptions": {
"moduleResolution": “node”
},
}
5.ts报Module ‘“xx.vue“‘ has no default export ==报错信息,提示组件没有到导出
原因:vetur是一个vscode插件,用于为.vue单文件组件提供代码高亮以及语法支持。那既然官方推荐 _volar_,简单的说volar是vetur的升级版本,提供了更好的功能并有更好的TS支持。
解决方法:选择卸载vetur,安装volar插件,最后,记得重启下VS Code。
6. vite + ts 找不到模块@/xxxx 或其相应的类型声明
前提: 在vite.config.ts里面有配置相关的@/路径标签
解决办法:在tsconfig.json 文件配置如下:
"compilerOptions": {
"baseUrl": "./",
"paths": {
"@/*":["./src/*"]
}
},
7. 在vite.config.ts里面声明node模块path,报找不到模块“path”或其相应的类型声明
原因:nodejs环境不支持typescript,就给它一个能够找到对应内容的方法或插件
解决方法:pnpm i @types/node -D