TypeScript declare file All In One

TypeScript declare file All In One

.d.ts 声明文件不包含实现，它只是类型声明，

https://www.typescriptlang.org/docs/handbook/declaration-files/by-example.html

https://www.typescriptlang.org/docs/handbook/declaration-files/templates/module-d-ts.html

https://www.typescriptlang.org/docs/handbook/declaration-files/deep-dive.html

main.d.ts / index.d.ts

package.json

{
  "main": "dist/index.js",
  "typings": "dist/index.d.ts",
}

https://www.typescriptlang.org/docs/handbook/declaration-files/dts-from-js.html

index.test-d.ts 类型定义测试

Check TypeScript type definitions

https://github.com/SamVerschueren/tsd/blob/main/package.json

declare global & namespace

https://gist.github.com/xgqfrms/5ddcddb5a8ca69b9846451f851f7e291

export { };

declare global {
    namespace Reflect {
       // 
    }
}

声明文件以 .d.t 为后缀

declare var jQuery: (selector: string) => any;

// jQuery('#foo');

https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/jquery/index.d.ts

2. TypeScript 引入声明文件

/// <reference path = " test.d.ts" />

3. 声明文件或模块的语法格式

declare module ModuleName {
  // 
}

DefinitelyTyped

很多流行的第三方库的声明文件不需要我们定义了

https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types

jquery

$ npm i -D @types/jquery

$ npm install --save-dev @types/jquery

https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/jquery

https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/jquery/index.d.ts
https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/jquery/JQuery.d.ts

https://www.npmjs.com/package/@types/jquery

https://www.npmjs.com/package/jquery

https://jquery.com/

node

$ npm i -D @types/node

$ npm install --save-dev @types/node

/// <reference types="node" />

https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/node

https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/node/index.d.ts
https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/node/console.d.ts

https://www.npmjs.com/package/@types/node

https://nodejs.org/

demo

jquery.d.ts

// 定义全局变量
// declare var $: (args: () => void) => void;


// 定义全局函数
declare function $(selector: string): void;

// overloading 重载 (函数名称相同，参数个数或参数类型不同)
declare function $(callback: () => void): void;

interface JqueryInstance {
  html: () => string;
}

declare function $(selector: string): JqueryInstance;


/*

$;
// ƒ (a,b){return new n.fn.init(a,b)}

$('div');
// 0 - n DOM
// context: document
// length: 97
// prevObject: [document]
// selector: "div"


$(function () {
  //
});

$('body').html(`<span>Text</span>`);
*/

refs

https://www.syncfusion.com/succinctly-free-ebooks/confirmation/jquery

https://s3.amazonaws.com/ebooks.syncfusion.com/downloads/jQuery_Succinctly/jQuery_Succinctly.pdf?AWSAccessKeyId=AKIAWH6GYCX34S3ZO7VC&Expires=1650024078&Signature=sko1j%2FoAk793HA8ed6AFNDcrvmA%3D

---

---

©xgqfrms 2012-2020

www.cnblogs.com/xgqfrms 发布文章使用：只允许注册用户才可以访问！

原创文章，版权所有©️xgqfrms, 禁止转载 🈲️，侵权必究⚠️！

---