安装@types/jquery产生非预期全局$声明 如何保留类型同时禁用全局声明

配置tsconfig禁用jquery全局类型自动注入 #

这是成本最低且无侵入的方案，不需要修改第三方类型包源码，也不影响正常导入后的类型校验：
打开你项目的tsconfig.json，在compilerOptions下新增types配置项：

{
  "compilerOptions": {
    // 其他原有配置保持不变
    "types": []
  }
}

如果你的项目依赖其他需要全局生效的类型声明（比如@types/node、@types/jest等），把对应包名加到types数组里即可，不要加jquery：

{
  "compilerOptions": {
    "types": ["node", "jest"]
  }
}

原理解释 #

TS默认会自动加载node_modules/@types下所有包的全局类型声明，所以@types/jquery里定义的全局$、jQuery才会在所有模块里生效。
显式配置types数组后，TS只会把数组中列出的包的全局类型注入到全局作用域，不在数组内的@types/jquery的全局声明就会失效，但你手动import $ from 'jquery'时，TS还是会正常读取@types/jquery的类型定义，不会出现any类型的问题。 #

备选方案：自定义声明覆盖全局类型 #

如果你需要保留默认的全局类型加载逻辑，不想修改types配置，可以在项目源码目录新增一个全局声明文件（比如命名为override-global.d.ts），添加以下内容：

declare global {
  var $: never;
  var jQuery: never;
}
export {};

这个方案会把全局作用域下的$、jQuery覆盖为never类型，未导入直接使用时会抛出类型错误，手动导入的$不受影响。

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