Vue3+Vite+TS使用npm包校验报错问题：无法找到模块xxx的声明文件、xxx.js”隐式拥有any类型

报错截图

• 比如下载并使用nprogress包，报错截图如下

• 比如下载并使用vue-baidu-calendar包，报错截图如下

报错场景

• 使用npm下载了某些包
• 在Vue3+ts项目中使用
• 引入进来后TS校验报错
• 但是不影响使用

解决方案

• 在项目根目录的env.d.ts文件中加上声明js模块兼容处理语句
• 要是没有就自己新建一个
• 什么npm包ts校验有问题
• 就声明一下这个为模块
• declare module 'xxx'

如下图：

/// <reference types="vite/client" />

// 声明xxx为模块，解决ts校验问题
declare module 'nprogress'
declare module 'vue-baidu-calendar'
declare module 'xxx'

原理

• 在env.d.ts文件中写 declare module 'xxx' 的意思是告诉TS编译器，
• 遇到xxx结尾的模块导入时，将这些模块视为一个模块整体
• 不当成文件，ts是去校验文件。
• 就能够正确处理了，就不会出现编译时的类型错误问题，就更加灵活了
• 因为有些老的包是没有用ts写
• 还是用js写的，（比如nprogress）或者其他等等