类库一般分为三类：全局类库、模块类库、umd类库。
jquery是umd类库，即可以通过全局方式引用，通过webpack的插件实现，也可以通过模块化的方式来引用。

全局类库声明文件

  1. declare function globalLib(options: globalLib.Options): void;
  3. declare namespace globalLib {
  4.     const version: string;
  5.     function doSomething(): void;
  6.     interface Options {
  7.         [key: string]: any
  8.     }
  9. }
  11. // declare关键字可以为一个外部变量提供类型声明

模块类库声明文件

  1. declare function moduleLib(options: Options): void
  3. interface Options {
  4.     [key: string]: any
  5. }
  7. declare namespace moduleLib {
  8.     const version:  string
  9.     function doSomething(): void
  10. }
  12. export = moduleLib

umd类库声明文件

  1. declare namespace umdLib {
  2.     const version: string
  3.     function doSomething():void
  4. }
  6. export as namespace umdLib
  8. export = umdLib

入口文件

  1. import $ from 'jquery'
  2. // 无法找到xxx声明文件，在ts中，使用非ts类库时，必须为这个类库编写一个声明文件，对外暴露它的API，有时，它的声明文件是包含在它的源码中，但有时是单独提供需要额外安装的
  3. // 安装类声明包：@types/jquery
  4. $('.app').css('color','red')
  6. /* 
  7.     我们在使用外部类库时，需要查询一下有没有声明文件：http://microsoft.github.io/TypeSearch
  8.     http://definitelytyped.org/guides //如何贡献声明文件
  9. */
  10. globalLib({x: 1})
  11. globalLib.doSomething()
  13. import moduleLib from './module-lib'
  15. moduleLib.doSomething()
  17. import umdLib from './umd-lib'
  18. // 如果注释上面，开启allowUmdGlobalAccess配置则解决问题
  19. umdLib.doSomething()
  21. // 给外部模块增加自定义方法
  22. import m from 'moment'
  23. declare module 'moment' {
  24.     export function myFunction(): void
  25. }
  27. m.myFunction = () => {}
  29. declare global {
  30.     namespace globalLib {
  31.         function doAnything(): void
  32.     }
  33. }
  34. // 这样会给全局命名空间造成污染，一般不建议这样做
  35. globalLib.doSomething = () => {}
  37. // 声明文件之间的依赖