声明文件中,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
需打开
网友评论