Typescript 如何找到 .d.ts 文件？

Question

我是一名新的打字稿开发人员，我正在开发一个使用打字稿和 webpack 的项目，一些用 js 编码的库需要 .d.ts 文件，但我很困惑 webpack 如何找到带有 ? 的.d.ts文件import * as PIXI from 'pixi.js'​​？

这是我的猜测：

1. webpack会找到“node_modules”命名的文件夹pixi.js，并在其中找到 package.json，如果有该types属性，则选择该文件作为.d.ts文件。

2. 如果按照1的方式找不到.d.ts文件，则进入node_modules/@types（或其他自定义文件夹），查找是否存在同名文件夹pixi.js，并选择index.d.ts文件为文件.d.ts。

3. 顺便说一句，我在index.d.ts中发现他们使用了module，为什么？我知道官方不推荐这个module关键字（用 代替namespace）。

Answer 1

该.d.ts文件通常放置在.ts提供打字的文件旁边。尽管 ts 编译器只是将文件与模块名称进行匹配，但它们本身甚至没有将它们放在相邻的位置。

它应该与 webpack 一样工作，编译器只知道如何找到类型，如果你只是将其指向它们所在的位置。

例如，我有一个名为 Typings 的文件夹，其中放置了 Express 应用程序的所有自定义类型。我的 tsconfig 看起来像

{
    "compilerOptions": {
        "noImplicitAny": true,
        "esModuleInterop": true,
        "target": "es5"
    },
    "include": [
        "app/**/*"
    ]
}

由于我的 types 文件夹位于 中./app，编译器没有问题，找到我的.d.ts文件和我的 gulpfile.js 看起来像

{
    "compilerOptions": {
        "noImplicitAny": true,
        "esModuleInterop": true,
        "target": "es5"
    },
    "include": [
        "app/**/*"
    ]
}

我想使用一个名为 custom-env 的包，它在 @types 存储库中没有 ts 类型。所以我刚刚创建了一个custom-env.d.ts包含内容的

declare module 'custom-env';
// This is a workaround. Always provide full and correct typings.

这样我就可以导入它并使用它。如果没有这个，依赖文件将无法编译。希望这可以帮助。