ts 【申明文件】

前言

　　在项目开发过程中，我们可能回在ts中使用到一些js全局，如jquery。以jquery举例，假设js版本的jquery作为一个全局库，而非使用import或require引入。那么如何在ts中像js一样直接使用$变量呢？ts的语法检测不会允许我们使用一个未经定义的变量，即便它已经同伙jquery.main.js在window上挂载。这时候就可以使用ts的声明文件*.d.ts。申明文件的作用就是：

　　告诉ts，某个 变量 或 function 或者 模块 是存在的，不需要ts去校验，我确定它存在

列子

　　声明变量

declare var foo: number; //声明一个全局变量

console.log(foo);//直接使用　　

　　声明方法

declare function greet(greeting: string): void; //声明一个方法

greet('test string') //直接使用

　　声明命名空间

//声明一个命名空间,可以当作{}类型的变量来使用
declare namespace testName {
  const testName: string;
  interface testInter {
    age: number;
  }
}

 //直接使用变量testName
  console.log(testName.testName);
  //直接使用接口 testInter
  const a: testName.testInter = {
    age: 1245,
  };

　　声明模块

//新增less module 测试
declare module "*.module.less" {
  //定义一个变量类型
  const normal: {
    prop1: string;
    prop2: string2;
    readonly [key: string]: string;
  };
  // 将其抛出
  export default normal;
}

import s from "./index.module.less";
//所有匹配*.module.less引入的模块，都具有声明的属性
console.log(s.prop1);
console.log(s.prop2);

值得注意的

　　1. 不要在声明文件*.d.ts中初始化声明对象，要记住，声明文件仅仅是负责声明目标存在，而不是定义它

//定义目标
declare const name1: string = "init prop name1";

console.log(name1); //error not defined

　　 2. 在使用声明的目标时，一定要保证目标已经被定义

//index.d.ts
declare const name1: string;//定义目标

//app.ts
console.log(name1);//error:not defined

　　　　引入定义声明的js文件

 //init.js
window.name1 = "init prop name1";

//先引入init.js
import "./init";
console.log(name1); //init prop name