在 typescript 中重命名外部 npm 包的命名空间

Question

我在打字稿中大量使用 ArcGIS JS API，使用他们的 @arcgis/core ES6 模块。在该包中，他们导出一个命名空间：

// @arcgis/core/interface.d.ts

declare namespace __esri {
  // a LOT of classes, functions, properties, etc
  ...
}

在我的文件中，我可以引用诸如

__esri.FeatureLayerProperties

或

__esri.GroupLayer

之类的内容。这很愚蠢，但我讨厌命名空间

__esri

，而且我很想在我自己的

esri

文件中将其重命名为

.d.ts

。

我已经研究了许多与此相关的问题，但没有什么比从外部 npm 包重命名命名空间更具体和简单的了，而无需手动指定命名空间中的所有内容。我该怎么做？

Answer 1

在 TypeScript 中重命名导入的命名空间，尤其是从 ArcGIS JS API 等大型库重命名，可能有点棘手。 TypeScript 不直接支持使用单个语句重命名整个命名空间。但是，您可以使用模块扩充为 __esri 命名空间创建别名。这涉及声明一个新模块并以新名称重新导出原始模块的内容。

以下是您可以采取的一般方法：

创建自定义 .d.ts 文件：首先在项目中创建自定义声明文件 (.d.ts)。

声明模块：在声明文件中，声明与您要导入的库的名称相匹配的模块（在您的情况下为@arcgis/core）。

重新导出命名空间：在此模块声明中，将 __esri 命名空间重新导出为 esri。

以下是自定义声明文件 (arcgis-core-augmentation.d.ts) 的示例：

// arcgis-core-augmentation.d.ts
declare module '@arcgis/core' {
  export import esri = __esri;
}

通过执行此操作，您将创建引用 __esri 的别名 esri。然后，在 TypeScript 文件中，您可以使用 esri 而不是 __esri:

import { esri } from '@arcgis/core';

const layerProperties: esri.FeatureLayerProperties = { ... };