声明文件

刘春龙原创2026/3/5大约 2 分钟

typescript中以.d.ts为后缀的文件被称为声明文件

当使用第三方库时，我们需要引用它的声明文件，才能获得对应的代码补全、接口提示等功能

声明文件分为三种类型

区分声明语句和声明文件

什么是声明语句

假如我们想使用第三方库 jQuery，一种常见的方式是在 html 中通过 <script> 标签引入 jQuery，然后就可以使用全局变量 $ 或 jQuery 了

$('#foo')
// or
jQuery('#foo')

但是在 ts 中，编译器并不知道 $ 或 jQuery 是什么东西

jQuery('#foo') // ERROR: Cannot find name 'jQuery'.

这时，我们需要使用 declare var 来定义它的类型

declare var jQuery: (selector: string) => any
jQuery('#foo')

什么是声明文件

通常我们会把声明语句放到一个单独的文件（jQuery.d.ts）中，这就是声明文件

//jQuery.d.ts
declare var jQuery: (selector: string) => any

// index.ts
jQuery('#foo')

注意

声明文件必需以 .d.ts 为后缀

第三方声明文件

如果在项目中使用某一个第三方库，通常也需要安装该库的声明文件，这样 typescript 能够对该库的代码进行类型检查，同时也提供该库的类型提示

这里我们用jQuery做例子

当然，jQuery 的声明文件不需要我们定义了，社区已经帮我们定义好了jQuery in DefinitelyTyped 我们可以直接下载下来使用

直接用 npm 安装对应的声明模块即可

npm install @types/jquery --save-dev

当然你还需在项目中引入 jQuery

当一个第三方库(公司内部提供的库)没有提供声明文件时，我们就需要自己书写声明文件了

// add.js
function add(x, y) {
  console.log(x, y)
}

编写声明文件

// add.d.ts
declare function add(x: number, y: number): void

// index.ts
add(10, 20)

注意

此时注意：如果add.d.ts没有被打开，仍然不可以使用，可以配置tsconfig.json文件

{
  "files": ["add.d.ts", "index.ts"]
}

至此，本章节的学习就到此结束了，如有疑惑，可对接技术客服进行相关咨询。