当前位置:首页>.d.ts文件-declare声明-vue3目录文件

.d.ts文件-declare声明-vue3目录文件

  • 更新时间 2025-07-22 15:27:07

.d.ts 文件

在 vue 项目中,有时会存在多个以.d.ts结尾文件。比如:env.d.ts、shims-vue.d.ts等,它是 ts 用来声明(declare)变量、模块、type、interface等。在.d.ts声明变量或者模块等东西之后,在其他地方可以不用import导入就可以直接使用,而且有语法提示。

在 vue 项目中,存在有一个 ts 配置文件tsconfig.json(或者其分级文件)中:

.d.ts文件-declare声明-vue3目录文件

"compilerOptions": {......"include": ["env.d.ts", "src/**/*", "src/**/*.vue"],......}

src/**/*:递归匹配任意子目录下的任意文件。

declare

declare 的作用

  • ts 用户在使用别人编译好的 ts 代码时,TSC 会寻找与 js 文件对应的.d.ts文件,让 ts 知道项目中涉及哪些类型,并有代码类型提示,无需重新编译 ts 代码,极大减少编译时间。
  • 定义在项目中任何地方都可以使用的全局类型,无需导入就可以使用(外参类型声明,需要和变量声明区别开)。
  • 描述通过 npm 安装的第三方模块(外参模块声明)。
  • 在.d.ts文件里,顶级声明必须以declare开头。
  • 在.d.ts文件里,以declare声明的变量和模块后,其他地方不需要引入,就可以直接使用。

注意:

  • 在.d.ts文件里,declare与export不要同级使用,不然的话,声明文件就需要导入(import ..... from ...)。
  • 在.d.ts文件里,如果顶级声明不用export的话,declare和直接写type、interface效果是一样的,在其他地方都可以直接引用。
type myType = string | number;// 两者效果相同declare type myType = string | number;

声明一个类型

declare type Asd {name: string;}

在 include 包含的文件范围内可以直接使用 Asd 这个 type。

声明一个模块

declare module '*.css';declare module '*.less';declare module '*.png';

这样,我们可以在 ts 中引入相关的文件而不报错了。

声明一个变量

declare var jQuery: (selector: string) => any;// 声明变量直接使用jQuery("#box")

对于引入第三方的库特别有效。

声明一个作用域

declare namespace API{interface ResponseObj {...}...}

最新文章

随机文章