TypeScript中的声明文件-JXin的博客

温馨提示

该文章距离上次更新已经过去了 1113 天，文章内容可能已经过时。

声明文件

声明文件是以 .d.ts 为结尾的文件，它的作用是为JS代码提供类型声明

// tsconfig.json
{
  "include": ["./src"],
}

1
2
3
4

// tsconfig.json
{
  "compilerOptions": {
    "typeRoots": ["./types"]
  },
}

1
2
3
4
5
6

工程是使用TS开发的，编译之后，就是JS文件，发布的是JS文件，如果其他开发者在使用的时候，也想获得类型声明，这时候就可以使用声明文件，来描述发布结果中的类型

在tsconfig.json中配置 declaration 为true就可以自动生成声明文件

{
  // 编译配置
  "compilerOptions": {
    "declaration": true
  },
}

1
2
3
4
5
6

在node环境中，如果更改了声明文件的路径，可以看到有报错

"compilerOptions": {
    "typeRoots": ["./types"]
  },

1
2
3

TypeScript中的声明文件
这时候我们需要自己写一个声明文件

// global.d.ts
interface Console {
  log(message?: any): void;
}

declare var console: Console;

1
2
3
4
5
6

在使用一些库的时候，由于库是使用JS写的，且没有类型声明，所以在使用的时候就会报错

例如：导入lodash的时候

import _ from "loadsh";

const newArr = _.chunk([3, 4, 5, 6, 7], 2);

console.log(newArr);

1
2
3
4
5

需要自己写一个声明文件

// lodash.ds.ts
declare module "lodash" {
  export function chunk<T>(array: T[], size: number): T[][];
}

1
2
3
4

如果使用的是TS开发的工程：编译完成之后，将编译结果所在的文件夹直接发布到npm上（有打包了声明文件）

如果是给其它第三方库写声明文件：