在 TypeScript 中，如何在外部模块中扩展环境 JQuery 接口？答案

【问题标题】：In TypeScript, how do I extend the ambient JQuery interface in an external module?在 TypeScript 中，如何在外部模块中扩展环境 JQuery 接口？
【发布时间】：2015-12-20 01:33:54
【问题描述】：

我正在使用 TypeScript 中的外部模块创建 jQuery 插件。似乎如果我将接口直接添加到模块中，我无法将新方法添加到 JQuery 环境接口声明中。

例如在jquery.d.ts

declare interface JQuery {
    ...
    text(): string;

    text(text: string|number|boolean): JQuery;
    ...
}

我有一个外部模块，它添加了一个 JQuery 插件并扩展了 JQuery 接口，但导入该模块的其他模块似乎看不到它。我猜它不会混合，因为声明只是覆盖了环境 JQuery 接口声明而不是扩展它。

它看起来像（在 myplugin.ts 中）：

interface MyCoolOptions {
    text?: string;
}

interface JQuery {
    myCoolPlugin(options: MyCoolOptions): JQuery;
}

$.fn.myCoolPlugin = function(options: MyCoolOptions) { this.text(option.text); }

然后我在使用它之前将插件导入另一个文件。

import * as cool from "myplugin";

$(".selector").myCoolPlugin({ text: "cool" });

问题是我收到一条消息说“属性'myCoolPlugin'不存在于类型 JQuery”。我宁愿不必在环境声明中复制接口。有没有办法在类型定义文件（.d.ts）中不用重新定义MyCoolOptions接口就可以扩展JQuery接口？

【问题讨论】：

标签： javascript jquery typescript typescript1.5

【解决方案1】：

如果我将接口直接添加到模块中，我似乎无法将新方法添加到 JQuery 环境接口声明中。

是的，您需要有yourlib.d.ts 来指定您如何扩展全局JQuery，然后是一个yourlib.ts，可以使用外部模块。

您也可以以全局方式编写代码。

【讨论】：