除了可读性之外，`.d.ts` 文件名是否有任何重要意义？

Question

在我的项目中，src 文件夹下有一个 shims-vue.d.ts 文件：

declare module '*.vue' {
  import type { DefineComponent } from 'vue'
  const component: DefineComponent<{}, {}, any>
  export default component
}

即使我将 shims-vue.d.ts 重命名为 foo.d.ts，声明仍然有效，所以我想知道 .d.ts 文件名除了可读性之外还有什么重要意义吗？

无论我将其重命名为什么，它的声明仍然有效，无需手动导入重命名的 .d.ts 文件。

Answer 1

声明文件表示另一个 JavaScript 文件（模块）的类型定义。声明的模块名称必须与将要导入的物理 JavaScript 文件的名称相匹配。

例如，要使以下内容正确工作，既可以用于输入，也可以用于运行时导入：

import { $ } from "jquery";

您声明的模块名称必须命名为“jquery”，因为您的 JavaScript 文件是 jquery.js:

declare module "jquery" {
    /...
}

声明文件如何命名 jquery.d.ts 或 my-declaration.d.ts 等并不重要，只要声明的模块名称正确并且对应于物理 JavaScript 文件即可。

模块声明也支持名称中的通配符，因此在您的情况下 *.vue 表示任何 *.vue 文件的默认“形状”（main.vue、page1.vue等）。

Answer 2

是的，d.ts 文件命名与模块解析相关。解析 import Foo from 'module' 时，tsc 会先查找 module.ts，然后再查找 module.d.ts。对于您的情况，很可能 tsc 仍在使用其他策略查找声明，例如 types 或 baseUrl 配置。

如果您想更好地了解其工作原理，此命令可能会有所帮助

tsc --traceResolution | grep -B 20 "shims-vue.d.ts"

完全没问题，但是，例如，这个 issue 很好地说明了 .d.ts 文件命名的重要性。

请参阅 module resolution docs 以获得更详细的解释。

除了可读性之外，`.d.ts` 文件名是否有任何重要意义？

Is there any significant meaning for `.d.ts` filenames except for readability?

typescript

vue.js

typescript-typings

vuejs3

typescript-declarations