关于(.d.ts)文件

1，前言

关于项目中的.d.ts文件是什么，可能大家一直都有疑问，首先需要说明的是，TS项目中才会有此文件。随着我们前端技术的不断发展，TS已经逐步取代JS成为前端语言的主流，TS最大的好处就是可以进行类型的约束和类型的检查，推断代码中可能出现错误的地方。但是有时候，我们在TS项目中会引入一些用JS写的库，那我们就不能用了吗？ 不是这样的，所以.d.ts主要作为一个描述文件可以定义引入的JS库的一些类型，这样我们就可以愉快的在TS项目中引入JS写的库的同时，也能享受到TS的类型检查了。。

2，.d.ts文件的编写

我们这里以lodash为例，lodash是一个JS写的函数库，其中包含了很多方法，如果我们直接在TS项目中引入此包会出现以下提醒错误：

解决方法有两个，一个是安装一个类型包，另一个是在.d.ts文件中做一个声明。我们先看后面这个解决方案，我们在.d.ts文件中做声明如下：

declare module 'lodash';

则上述文件不会再报错，也可以完美运行，但是我们此时也不知道我们引入的上述uniq（去重函数）他的入参和出参的类型，如果我们像js那样使用传任意类型，很有可能出现类型错误从而出现不可预料的bug，所以我们在.d.ts文件中写下如下的定义：

​
declare module 'lodash' {
    export function uniq<T>(list: T[]): T[]
};

此代码是传入一个任意类型的数组，而返回一个相同类型的数组，如果此时我们在ts代码中写的参数类型不是一个数组将会报错：

这就很好的规避了代码出现错误的可能性。

但是这时候就会有人问了，lodash这么多函数，难道我要去一个个定义类型吗？同学们不用带担心，看上述解决办法的第一个，会发现他提示你去安装一个对应的@types/lodash的包（如果有的话），是的，已经有人帮你定义好了这些JS包的类型，当然也有一些比较小众的包无人去定义。。

3，@types 类型定义方式

@types类型定义的方式是从TS2.0开始的时候所支持方式，相对于以前DefinitelyTyped和typing方式，其不需要额外的工具来维护，但是需要你额外的引入对应JS包的类型定义包

默认情况下，所有的 @types 包都会在编译时应用，任意层的 node_modules/@types 都会被使用，如下，我们安装了lodash的@types包，那么lodash的类型就会在node_modules/@types文件夹下，此时我们不用在文件里定义其类型了，是不是方便了很多。

4，总结

“d.ts”文件用于为 TypeScript 提供有关用 JavaScript 编写的 API 的类型信息。简单讲，就是你可以在 ts 中调用的 js 的声明文件。TS的核心在于静态类型，我们在编写 TS 的时候会定义很多的类型，但是主流的库都是 JS编写的，并不支持类型系统。这个时候你不能用TS重写主流的库，这个时候我们只需要编写仅包含类型注释的 d.ts 文件，然后从您的 TS 代码中，可以在仍然使用纯 JS 库的同时，获得静态类型检查的 TS 优势。但是对于一些比较常用的JS包，也会有专门的@types包，其定义了JS包的一些api类型。