如何引用由 NPM 包中 tsc 的“声明”选项生成的 TypeScript .d.ts 文件中声明的类型？

Posted 2023-03-13

【中文标题】如何引用由 NPM 包中 tsc 的“声明”选项生成的 TypeScript .d.ts 文件中声明的类型？

【英文标题】：How do I reference a type declared in a TypeScript .d.ts file generated by tsc's "declaration" option in NPM package?

【发布时间】：2018-03-20 21:30:43

【问题描述】：

大图：我的组织有几个用 TypeScript 编写的 Angular 应用程序，每个应用程序都包含大量重复的代码。我们已经开始将可重用的 TypeScript 代码打包为 NPM 包并将它们发布到 TFS 2017 中的私有 NPM 注册表。我们正在使用 Gulp 将可重用的 TypeScript 代码编译为 javascript（使用 gulp-typescript）并使用“声明" tsconfig.json 中的属性以强制生成 .d.ts 文件。这是可行的，并且 .d.ts 文件包含在 NPM 包中的 JavaScript 输出旁边，该包安装在客户端应用程序中。但是，在消费应用程序中引用其中的类型是行不通的，除非我直接在消费应用程序中引用 .d.ts 文件，我想避免这种情况。

我们使用带有 @types 方法的 TypeScript 2.5 来访问第三方类型，例如使用 Angular 我在 package.json 文件中有 "@types/angular": "1.6.32" - 这会导致 node_modules\@ types\angular\index.d.ts 出现，当我在 TypeScript 文件中键入 ng.IServiceProvider 时，Visual Studio 似乎神奇地发现该文件提供了强大的类型检查。

它并没有神奇地发现我自己的位于 node_modules\my-package\dist\my-package.d.ts 的 Typings 文件。但是，如果我将其添加到 TypeScript 文件中：

/// <reference path="../../../node_modules/my-package/dist/my-package.d.ts" />

然后我可以引用文件中定义的类型。但是，这不是一个很好的解决方案，因为这意味着每个使用应用程序都需要知道 node_modules 文件夹中我创建的每个自定义 Typings 文件的路径。大概这就是 @types 语法应该帮助避免的。

有没有办法让消费项目神奇地发现包含在 NPM 包中的自定义类型文件（与单独作为包发布的类型文件相反？）我知道我可以做后者，但如果可以避免的话，我真的不想为我们创建的每个自定义 NPM 包创建单独的 @types 包。

【参考方案1】：

我找到了一种方法来完成这项工作：

    "name": "my-package",
    "main": "./dist/my-package.js",
    "types": "./dist/my-package.d.ts"

在 NPM 包的 package.json 文件中，您需要添加对捆绑类型包的引用，如上所示。这使得 Visual Studio 可以选择引用并为包中包含的类型提供智能感知。