如何为导出为全局的 javascript 模块创建类型声明？答案

【问题标题】：How to create typings declaration for javascript module exported as a global?如何为导出为全局的 javascript 模块创建类型声明？
【发布时间】：2017-10-19 23:52:03
【问题描述】：

我编写了一个用 typescript 编写的库，并使用 webpack 将其捆绑到一个缩小的 js 文件中，该文件将库导出为一个全局变量。我想为我团队的开发人员分发这些类型。他们不是打字稿用户，因此他们将通过<script src="..."> 标记导入库本身，并且他们将使用三斜杠引用指令/// <reference path="..." /> 或typings 或类似的东西导入打字。

那么问题来了：

如何为使用 vs 代码的 js 开发人员启用我的库的类型化（即智能感知）？如何声明有一个全局变量可以导出我输入的值点呢？

我已启用 declarationDir and declartion compiler options 为我的所有打字稿源文件创建声明文件 (*.d.ts)，但这些声明并未声明这些方法有可用的全局变量。

我尝试在捆绑和缩小的index.js 文件所在的同一文件夹中手动创建index.d.ts 声明，但我无法让它工作。

这是我尝试过的：

import * as myModule from './typings/src/';

declare module TheGlobalVariable {
    // how do I declare that `TheGlobalVariable` has the same methods
    // as `myModule` exports?
    export = myModule; // doesn't work
}

其中./typings/src/index.d.ts 是为此库的入口点生成的声明文件，TheGlobalVariable 是 webpack 导出的全局变量的名称。

有什么想法吗？

【问题讨论】：

标签： javascript typescript webpack typescript-typings

【解决方案1】：

哦，我想通了。

在我捆绑的 js 库文件 (index.js) 所在的同一文件夹中，我添加了一个文件 index.d.ts。这是那个文件：

export * from './src';
export as namespace OntologyStore;

关键促成因素是export as ...。

请参阅此module template 和this documentation on library structures。

还将 webpack 的 libraryTarget 更改为 'umd'。 UMD 模块检查是否有模块加载器，如果没有，它将导出到全局。我也不必使用declaration 或declarationDir 编译器选项。

【讨论】：

【解决方案2】：

使用这个结构，https://github.com/botika/typescript-package。只遵循 README.md

【讨论】：