typescript - Yalnızca okunabilirlik dışında `.d.ts` dosya adları için herhangi bir anlam var mı?

Projemde, src klasörü altında bir shims-vue.d.ts dosyası var:

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

shims-vue.d.ts dosyasının adını foo.d.ts olarak değiştirmiş olsam bile, bildiriler hala geçerli oluyor, bu yüzden merak ediyorum, .d.ts dosya adlarının okunabilirlik dışında önemli bir anlamı var mı?

Onu ne olarak yeniden adlandırdıysam, yeniden adlandırılmış .d.ts dosyasını manuel olarak içe aktarmadan deklarasyonları hâlâ çalışıyor.

Cevap #1

Deklarasyon dosyası, başka bir JavaScript dosyası (modül) için tip tanımlarını temsil eder. Beyan edilen modül adı, içe aktarılacak fiziksel JavaScript dosyasının adıyla eşleşmek zorundadır.

Örneğin, aşağıdakinin hem tiplemeler hem de çalışma zamanı importu için doğru çalışabilmesi için:

import { $ } from "jquery";

Beyan ettiğiniz modül adı "jquery" olmalıdır, çünkü JavaScript dosyanız jquery.js:

declare module "jquery" {
    /...
}

Bildirim dosyasını jquery.d.ts veya my-declaration.d.ts gibi nasıl adlandırdığınız önemli değildir, yeter ki bildirilen modül adı doğru olsun ve fiziksel JavaScript dosyasıyla eşleşsin.

Modül beyanları ayrıca adlarda joker karakterleri destekler, bu nedenle sizin durumunuzda *.vue, herhangi bir *.vue dosyasının (main.vue, page1.vue, vb.) varsayılan "şeklini" temsil eder.

Cevap #2

Evet, d.ts dosyalarının isimlendirilmesi modül çözümlemesi için önemlidir. import Foo from 'module' ifadesini çözerken, tsc önce module.ts dosyasına, ardından module.d.ts dosyasına bakacaktır. Muhtemelen sizin durumunuzda tsc, types veya baseUrl yapılandırması gibi diğer stratejileri kullanarak bildirileri hâlâ buluyordur.

Bunun nasıl çalıştığını daha iyi anlamak istiyorsanız, bu komut faydalı olabilir

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

Bu tamamen sorun değil, ama örneğin, bu konu .d.ts dosya adlandırmasının neden önemli olduğuna dair iyi bir örnektir.

Daha ayrıntılı bir açıklama için modül çözümleme belgelerine bakın.

İlgili makaleler