Node.js使用TypeScript导入JSZip后出现TS2322错误如何解决

• JSZip 3.7.1的类型定义依赖了@types/node包，其中对ProcessEnv的接口定义默认所有属性均为string | undefined的可选类型
• 导入JSZip后，全局的process.env类型会被@types/node的定义覆盖，你代码里直接把process.env的属性赋值给明确声明为string/number的变量，就触发了TS的类型不匹配报错
• 删除JSZip导入后，全局不再加载@types/node的ProcessEnv定义，所以报错消失

以下三种方案可按需选择：

方案1：添加非空断言+类型转换 #

确认对应环境变量一定存在的场景下，在变量后加!非空断言，明确告知TS该值不可能为undefined；同时注意process.env的所有属性默认都是字符串类型，赋值给数值变量时需要额外做类型转换：

const env: string = process.env.NODE_ENV!;
private timeoutTime: number = Number(process.env.VUE_APP_TIME_OUT!); 

方案2：全局扩展ProcessEnv接口类型 #

在项目的类型声明文件（一般为src/shims-vue.d.ts或者自定义的env.d.ts）中添加如下声明，明确指定你用到的环境变量为必存类型：

declare namespace NodeJS {
  interface ProcessEnv {
    NODE_ENV: 'development' | 'production' | 'test';
    VUE_APP_TIME_OUT: string;
    // 其他项目用到的环境变量都可以在此处补充声明
  }
}

添加后TS会自动合并接口定义，后续所有process.env对应属性的类型都会变成你声明的必选类型，无需再单独加断言。

方案3：直接强转类型（不推荐） #

如果不想逐个处理环境变量，可以在赋值时用类型断言直接强转：

const env = process.env.NODE_ENV as string;
private timeoutTime = process.env.VUE_APP_TIME_OUT as unknown as number;

内容的提问来源于stack exchange，提问作者Mike Weber