什么是.d.ts文件
.d.ts文件是TypeScript中用于声明类型定义的文件扩展名。它允许开发者为JavaScript库或没有直接包含类型信息的代码提供类型注释,使得TypeScript编译器能够理解这些代码的结构和类型,从而在开发阶段提供静态类型检查、智能提示等功能,而不会对原始代码进行任何修改或编译操作。
简单而言:声明在.d.ts文件中的结构在项目其他页面中使用时无需引入,直接使用(相当于全局变量)
使用方法
第一步
在src同级目录下创建目录,在该目录下创建*.d.ts文件,这里我创建的是types目录,创建user.d.ts文件,用来封装typescript中的interface接口语法。
第二步
在tsconfig.app.json文件中配置include配置项,按以下形式添加你新创建的*.d.ts文件路径(**代表文件目录,*代表文件名)
// include包含的形式命名的文件可以被全局访问
"include": [
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"types/**/*.d.ts"
]
第三步
在*.d.ts文件中写需要被引用的内容,这里我写的是interface接口:
// 在.d.ts文件中配置的内容可以在其他文件中引用
interface interA {
alls: string;
gee: number;
}
interface interB {
[index: number]: Array<interA>
}
在其他页面中直接使用:
其他常用内容
基本结构 —— 一个简单的*.d.ts文件可能包含以下内容:
// 声明一个全局变量
declare var myLib: {
version: string;
doSomething(data: any): void;
};
// 声明一个模块
declare module 'my-module' {
export function greet(name: string): string;
}
这里,declare
关键字用来定义类型信息而不实际实现它。var
用于声明全局变量,而module
则用于定义模块及其导出的成员。