老旧无法升级的TS项目导入无.d.ts声明JS库方案咨询

结合你当前的tsconfig配置（AMD模块规范、ES5编译目标、开启JS文件支持、单bundle输出），不需要升级项目架构、不需要使用import/require语法，可直接按以下方案实现引入：

方案1：全局挂载引入（适配绝大多数无类型JS库，改造成本最低） #

该方案完全匹配你当前的打包逻辑，无额外侵入性：

• 将待引入的无类型JS库文件放到非node_modules目录（比如你现有的./lib/目录），把文件路径加到tsconfig.json的include数组中，和现有./lib/lib.js的处理逻辑保持一致。由于你开启了allowJs且配置了checkJs: false，TS编译时会直接把这个JS文件的内容合并到最终的bundle.js中，不会对JS内容做额外校验。
• 在项目中任意TS文件可寻址的位置新建一个简易声明文件（比如src/types/global.d.ts），只需要声明库挂载到全局的变量即可，不需要补全全量类型，内容参考：

  // 将XxxLib替换为你的JS库挂载到window上的全局变量名
  declare const XxxLib: any;
  

• 后续在TS代码中直接使用XxxLib调用库能力即可，不需要写任何import/require语句。只要JS库本身逻辑正常挂载全局变量，运行时不会出现未定义错误。

方案2：AMD三斜线依赖声明（适配符合AMD规范的JS库） #

如果你要引入的JS库本身遵循AMD规范编写，不想污染全局作用域，可以用TS原生支持的三斜线指令声明依赖，全程不需要使用import/require语法：

• 先把JS库文件放到非node_modules的可include目录下。
• 在需要用到这个库的TS文件最顶部，添加如下依赖指令和类型声明：

  /// <amd-dependency path="../lib/你的库文件相对路径.js" name="XxxLib" />
  declare const XxxLib: any;
  

• TS编译AMD模块、生成outFile单bundle时，会自动按依赖顺序把对应JS库合并进去，你可以直接在当前文件内使用XxxLib调用库能力。

适配当前配置的注意事项 #

• 不要把待引入的JS库放到node_modules目录下，你的tsconfig已经配置exclude规则排除该目录，放入的文件不会被TS识别，也不会被打包进最终bundle。
• 如果引入的JS库存在其他依赖，注意在include数组中把被依赖的文件放在靠前位置，TS生成单bundle时会按include顺序、三斜线依赖的声明顺序合并文件，避免运行时出现依赖未定义的问题。
• 由于你配置了skipLibCheck: true和checkJs: false，不需要为第三方JS库补全全量.d.ts类型声明，只需要上面提到的一行any类型声明即可跳过所有TS类型校验，不会阻塞编译流程。

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