vue+tsc+noEmit导致打包报TS类型错误问题及解决方法

项目场景：

提示：这里简述项目相关背景：

当我们新建vue3项目,package.json文件会自动给我添加一些配置选项,这写选项基本没有问题,但是在实际操作过程中,当项目越来越复杂就会出现问题,本文给大家分享vue+tsc+noEmit导致打包报TS类型错误问题及解决方法

---

问题描述

提示：这里描述项目中遇到的问题：

当我们新建vue3项目，package.json文件会自动给我添加一些配置选项，这写选项基本没有问题，但是在实际操作过程中，当项目越来越复杂就会出现问题。本文列举一个目前我遇到的一个问题：打包后报了一堆TS类型错误，怎么消除这些错误？

---

原因分析：

提示：这里填写问题的分析：

打包执行的是npm run build命令，那么具体执行了什么呢？我们查看package.json中配置项。

可以发现在build时，执行了vue-tsc --noEmit && vite build，其中

• vue-tsc：Vue 官方提供的命令，用于执行 TS 的类型检查。它在执行时会根据项目中的 tsconfig.json 文件配置进行类型检查
• --noEmit：TS 编译器的选项，使用 --noEmit 选项后，编译器仅执行类型检查，而不会生成任何实际的编译输出

所以可以看出了，在打包的时候编译器执行了TS类型检查，所以才报了一堆错，类型错误最终不会影响项目的正常运行

---

解决方案：

提示：这里填写该问题的具体解决方案：

根据上面分析，package.json中的"scripts"修改如下：

另外项目通常在编译时候，也会对我们引入的一些依赖包进行类型校验，我们并不需要这个操作，所以可以在tsconfig.json中设置如下：

"compilerOptions":{"skipLibCheck":true
},

设置后编译器不会检查库文件中的类型定义是否正确，也不会对库文件的使用进行类型检查。

再次打包就非常顺利～