TypeScript 模块代码的类型描述文件

安装 jquery
cnpm install jquery --save

不以 cdn 的方式引入，而是以模块化的方式引入 jquery
 
index.html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script src="./page.ts"></script>
  
</body>
</html>

 

 

page.ts

import $ from 'jquery';

$(function () {
  $('body').html('<div>121212</div>');
  new $.fn.init()
})

 

 

jquery.d.ts

// es6 模块化
declare module 'jquery' {
  interface JqueryInstance {
    html: (html: string) => JqueryInstance
  }
  // 混合类型
  function $(readyFunc: () => void): void;
  function $(selector: string): JqueryInstance;
  namespace $ { // $.fn.init
    namespace fn{
      class init{}
    }
  }

  export = $;
}

 

posted @ 2020-06-29 06:25  wzndkj  阅读(211)  评论(0)  编辑  收藏  举报