TypeScript中declare关键字的用法详解

作者:闭包旅人

时间:2026-10-31

浏览:207

本文介绍TypeScript中declare关键字的多种应用场景。通过示例演示如何声明顶层类型、模块(如CSS/图片)及全局变量,帮助开发者在不引入额外文件的情况下直接使用类型定义,有效解决第三方库集成时的类型报错问题。

文章目录

在1..d.ts文件中,顶层的声明必须使用declare关键字进行定义。

使用declare声明的变量和模块,在后续代码中无需额外引入即可直接调用。

需要注意的是,必须在项目的配置文件中进行相关配置,以正确引入声明文件。

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

声明自定义类型

declare type Asd {
    name: string;
}

配置包含范围内的文件可以直接使用Asd这一type定义。

声明模块

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

通过这种方式,在TypeScript中引入相关资源文件时便不会再出现类型错误。

声明全局变量

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

这种方法对于集成第三方库尤为有效。

声明命名空间(作用域)

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

注意事项

  • declare与export不应在同一层级混用,否则会导致声明文件必须被显式导入才能生效。
  • 在声明文件中,type与interface前也可以省略declare,其最终效果保持一致。
type myType = string | number;
// 两者效果相同
declare type myType = string | number;

以上就是关于TypeScript中declare关键字的基础用法介绍,更多相关内容可参考本站过往文章或继续浏览后续教程,感谢支持。

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章