Vue'da .tsx kullanarak TypeScript 7'yi gün birinde çalıştırmak

TypeScript 7'nin Go tabanlı yeni derleyicisi yayınlandı, ancak Vue, Svelte, Astro ve MDX gibi kendi dosya formatlarını kullanan araçlar bunu henüz kullanamıyor. Sebep, Volar gibi dil servislerinin TypeScript'in iç API'lerine bağımlı bir 'shim' katmanı üzerinden çalışması ve bu katmanın TypeScript 7'nin yeni yapısına henüz uyarlanmamış olması. Yazar, Vue bileşenlerini .vue dosyaları yerine doğrudan .tsx dosyalarında yazdığını ve bu sayede hiçbir ek araca veya port işlemine ihtiyaç duymadan TypeScript 7'yi üretimde kullanabildiğini anlatıyor.

Bunun teknik temeli basit: Vue, .vue dosyalarını her zaman isteğe bağlı kılmış, render fonksiyonlarını ve JSX'i resmi olarak desteklemiştir. jsx ve jsxImportSource ayarlarıyla yapılandırılan bir .tsx dosyası, derleyici, linter ve editör için sıradan bir TypeScript dosyasından farksızdır; Volar'ın dosya sistemini taklit eden karmaşık mekanizmasına gerek kalmaz.

Yazı, JSX ile yazmanın Vue'nun reaktivite sistemini kaybettirmediğini de vurguluyor: React'in aksine Vue, bağımlılıkları çalışma zamanında otomatik izler, bu da useMemo/useEffect tarzı manuel bağımlılık listeleri gerektirmez. Sekiz yüz civarında TSX bileşenden oluşan bir Nuxt uygulamasında, TypeScript 7'ye geçiş sadece bir sürüm güncellemesiyle tamamlanmış ve tüm tip kontrolü yaklaşık 46 saniyede tamamlanabiliyor.