美文网首页
Typescript 声明文件d.ts declare

Typescript 声明文件d.ts declare

作者: wyc0859 | 来源:发表于2022-03-13 01:00 被阅读0次

声明文件中,declare 表示声明的意思
js原有类型必须加declare,js不存在的类型不用加,如:interface、type;
class本质就是函数,js中有函数,所以class必须加declare

declare let/const  // 声明全局变量
declare function   // 声明全局方法
declare class      // 声明全局类
declare enum       // 声明全局枚举类型
declare namespace  // 声明(含有子属性的)全局对象
interface/type     // 声明全局类型

可用declare或export关键字;区别declare全局,export需import导出


声明文件 .d.ts

首先:tsconsif 文件中
declaration: true 需打开;
"skipLibCheck": true(跳过声明检测)需关闭。不然不写declare关键字也不会报错
"include": ["./src/**/*.ts", "./src/**/*.d.ts", "./src/**/*.js" ] 手动加入include 需要编译的ts文件一个

**/匹配任何层级的嵌套目录 *匹配零个或者多个字符

// 新建一个 xx.d.ts
type cssSelector = {
  css: (key: string, value: string) => cssSelector;
};
declare function $(ready: () => void): void;
declare function $(selector: any): cssSelector;
// 在src下 任意 ts文件中使用
$(function () {});
$("#app").css("margin", "10px").css("color", "red");

命名空间和嵌套命名空间在声明文件中的使用

// xx.d.ts
declare namespace JQuery {
  export namespace $ {
    function ajax(url: string, settings?: any): void;
    function get(url: string, settings?: any): void;
    function post(url: string, settings?: any): void;
  }
}
// ts文件中使用
JQuery.$.get("http://sss");

模块声明

比命令空间省事一些,既然是模块,那一定需要import导入

//xx.d.ts
declare module "JQueryModule" {
  namespace $$ {
    function ajax(url: string, settings?: any): void;
    function get(url: string, settings?: any): void;
    function post(url: string, settings?: any): void;
  }
  //export default $ //为了兼容规范,用下面种比较好
  export = $$;
}
//ts中使用
import $$ from "JQueryModule";
$$.get("http://sss");

ts中引入js文件

tsconsif.json文件中 "allowJs": true 需打开

相关文章

网友评论

      本文标题:Typescript 声明文件d.ts declare

      本文链接:https://www.haomeiwen.com/subject/geqrdrtx.html