如何在扩展 JavaScript 原型的 TypeScript 文件中导入库

Question

使用this question 中描述的技术，我正在尝试使用 Moment.js 在 TypeScript 项目中扩展 Date 原型。

扩展Date 原型的工作原理，如下所述：

interface Date {
    myExtension: () => string;
}

if (!Date.prototype.myExtension) {
    Date.prototype.myExtension = function(): string {
        return 'some value derived from a date';
    };
}

但是，一旦我导入 Moment.js，通过将以下行添加到我的文件中，TypeScript 会使我的代码无效，告诉我 Property 'myExtension' does not exist on type 'Date'。

import * as moment from 'moment';

我应该以其他方式声明 Moment.js 导入吗？

Answer 1

不确定moment 与您的问题有何关联 - 我在这里假设您想将全局类型添加到Date.prototype，这将由moment 在内部实现。

您可以通过定义类型 1.) 在它们自己的 .d.ts 文件中或 2.) 在现有的 file modules 中定义类型来扩充内置类型 Date 的 global type definition。

1.全局声明文件

创建global.d.ts（命名无关紧要）。将Date 接口放入其中，这将是merged 与lib.d.ts 中已经存在的Date 接口。确保您没有任何顶级 export 或 import 声明来将类型附加到全局命名空间/范围。 global.d.ts 将自动包含在带有tsconfig.json 的项目中。

// global.d.ts:
interface Date {
  myExtension: () => string;
}

2。文件模块

使用declare global 将定义包装在全局上下文中：

// inside some file module with export/import
...
declare global {
  interface Date {
    myExtension: () => string;
  }
}

在 App.ts 中测试

// use moment for implementation
import * as moment from "moment"; 

if (!Date.prototype.myExtension) {
  Date.prototype.myExtension = function(): string {
    return "some value derived from a date";
  };
}

const d = new Date();
console.log(d.myExtension()); // some value derived from a date