Vue2+TypeScript项目引入interactjs出现类型检查错误导致构建失败

算力阿峰

2026-10-14

问题解决方案

依赖冲突排查修复
首先执行对应命令检查是否存在多版本的@interactjs/types依赖：
```
# npm 环境
npm ls @interactjs/types
# yarn 环境
yarn why @interactjs/types
```
如果确认有多个版本共存，强制锁版本即可：
- yarn 环境在package.json中添加resolutions字段：
```
"resolutions": {
  "@interactjs/types": "1.10.11"
}
```
- npm 8+ 环境在package.json中添加overrides字段：
```
"overrides": {
  "@interactjs/types": "1.10.11"
}
```
配置完成后删除node_modules和包锁文件重新安装依赖即可。
快速绕过构建校验
直接在项目根目录的tsconfig.json中添加skipLibCheck: true配置，该配置会跳过所有node_modules下第三方包的类型声明校验，不会影响业务代码的类型检查，是成本最低的解决方案：
```
{
  "compilerOptions": {
    // 其他原有配置保留
    "skipLibCheck": true
  }
}
```
你新建的空白项目能正常构建就是因为默认生成的tsconfig默认开启了这个配置，和你的项目原有配置不一致才会出现复现差异。
手动修复类型声明（适合不想修改全局TS配置的场景）
用patch-package给错误的类型文件打永久补丁：
1. 打开node_modules/@interactjs/types/index.d.ts，找到第287行的BaseEvent接口声明，把泛型约束改成和267行的类声明一致：
```
// 修改前
export interface BaseEvent<T extends ActionName> {
// 修改后
export interface BaseEvent<T extends ActionName | null = never> {
```
2. 剩余的泛型约束报错，把所有对应位置的T替换为Exclude<T, null>即可
3. 执行npx patch-package @interactjs/types生成补丁文件，后续所有安装依赖的场景都会自动应用这个修正。