如何在 TypeScript 中使用带有“declare”关键字的导入？答案

【问题标题】：How to use import with "declare" keyword in TypeScript?如何在 TypeScript 中使用带有“declare”关键字的导入？
【发布时间】：2020-10-11 03:52:37
【问题描述】：

我有一个带有变量声明的 d.ts 文件，如下所示：

declare var $: () => SomeValue;

而且效果很好，在其他地方我可以在不导入的情况下使用这个变量。

但是，当我从另一个模块添加一些导入时，这个变量在其他代码中是不可见的。

import { SomeValue } from "./SomeModule";
declare var $: () => SomeValue;

这个需要什么语法？

【问题讨论】：

与declare无关。它与假定文件是脚本还是模块之间的区别有关。模块是包含 1 个或多个 import 或 export 语句的文件。模块中的声明作用于该模块，并且必须导出以供外部使用。

标签： javascript typescript es6-modules typescript-declarations

【解决方案1】：

您需要在变量中添加“export”关键字。

export declare var $: () => SomeValue;

如果您希望此变量仅在同一个文件中可用，则无需添加“export”关键字。但是，如果您希望它在其他文件中使用，则需要添加“export”关键字。

常量、函数和类也是如此。向其添加“导出”将使其可供其他文件导入。

【讨论】：

【解决方案2】：

当.d.ts 文件使用export 或import 时，它们将被视为module 而不是环境typings。

但是，您仍然可以使用 declare global 添加到全局命名空间。这允许您扩充全局类型，甚至添加新的全局类型：

.d.ts

import { SomeValue } from "./SomeModule";

declare global {
    interface Window {
        $: () => SomeValue;
    }
    interface SomeGlobalInterface {
        x: number;
    }
}

.ts

// () => SomeValue
window.$

let value!: SomeGlobalInterface;
value.x;

【讨论】：