TypeScript Derlemesi Açıklandı Kod Nasıl Derlenir ve Çalıştırılır

TypeScript, düz JavaScript'e derlenen, statik olarak yazılmış bir JavaScript üst kümesidir. TypeScript'i etkili bir şekilde kullanmak için derleme sürecini anlamak çok önemlidir. Bu kılavuz, kurulumdan yürütmeye kadar TypeScript kodunu derleme ve çalıştırmanın temellerini size gösterecektir.

TypeScript Derlemesini Anlama

TypeScript kodu doğrudan tarayıcılar veya Node.js tarafından yürütülmez. Bunun yerine, JavaScript'e derlenmesi gerekir. TypeScript derleyicisi, `tsc`, bu görevi gerçekleştirir. İşlem, TypeScript dosyalarını (`.ts`) herhangi bir JavaScript ortamında çalıştırılabilen JavaScript dosyalarına (`.js`) dönüştürmeyi içerir.

TypeScript Ortamınızı Kurma

TypeScript kodunu derleyebilmeniz için Node.js ve npm'in yüklü olduğundan emin olun. TypeScript'i npm kullanarak global olarak yükleyebilirsiniz:

npm install -g typescript

Bu komut TypeScript derleyicisini (`tsc`) global olarak kurar ve sisteminizin her yerinden erişilebilir hale getirir.

TypeScript Kodunu Derleme

Bir TypeScript dosyasını derlemek için terminalde proje dizininize gidin ve `tsc` komutunu ve ardından dosya adını kullanın:

tsc filename.ts

`filename.ts`'i TypeScript dosyanızın adıyla değiştirin. Bu komut TypeScript kodunu aynı adı taşıyan ancak `.js` uzantısına sahip bir JavaScript dosyasına derler.

TypeScript Yapılandırma Dosyası Kullanma

TypeScript derleyici seçeneklerini ve proje ayarlarını yapılandırmak için bir `tsconfig.json` dosyası kullanılır. Bu dosyayı şunu kullanarak oluşturabilirsiniz:

npx tsc --init

İşte basit bir `tsconfig.json` dosyası örneği:

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "strict": true,
    "outDir": "./dist",
    "sourceMap": true
  },
  "include": [
    "src/**/*"
  ],
  "exclude": [
    "node_modules"
  ]
}

Bu yapılandırma, TypeScript'in kodu ECMAScript 6'ya (`es6`) derlemesini, CommonJS modüllerini kullanmasını, sıkı tip denetimini etkinleştirmesini, derlenmiş dosyaları `dist` dizinine çıktı olarak göndermesini ve hata ayıklama için kaynak haritaları oluşturmasını belirtir.

Bir Projedeki Tüm Dosyaları Derleme

`tsconfig.json` dosyası mevcut olduğunda, projenizdeki tüm TypeScript dosyalarını şu komutu çalıştırarak derleyebilirsiniz:

tsc

Bu komut `tsconfig.json` dosyasını okur ve yapılandırmada belirtilen tüm TypeScript dosyalarını derler.

Derlenmiş JavaScript Kodunu Çalıştırma

TypeScript kodu JavaScript'e derlendikten sonra, Node.js kullanarak çalıştırabilir veya bir web projesine dahil edebilirsiniz. Node.js ile bir JavaScript dosyasını çalıştırmak için şunu kullanın:

node dist/filename.js

`filename.js` ifadesini `dist` dizininde bulunan derlenmiş JavaScript dosyanızın adıyla değiştirin.

Yaygın Derleme Hataları

Derleme sırasında hatalarla karşılaşabilirsiniz. İşte bazı yaygın sorunlar ve bunları nasıl çözeceğiniz:

• Sözdizimi Hataları: Sözdizimi sorunları için TypeScript kodunuzu kontrol edin. Derleyici sorunların nerede olduğunu belirten hata mesajları sağlayacaktır.
• Tür Hataları: Kodunuzun TypeScript'in tür sistemine uyduğundan emin olun. Tür açıklamalarını inceleyin ve doğru tanımlandığından emin olun.
• Yapılandırma Sorunları: `tsconfig.json` dosyanızın doğru şekilde yapılandırıldığını ve projenizin dizininin kökünde bulunduğunu doğrulayın.

Çözüm

TypeScript kodunu derlemek, geliştirme sürecinde temel bir adımdır. Ortamınızı nasıl kuracağınızı, derleyiciyi nasıl yapılandıracağınızı ve yaygın hataları nasıl ele alacağınızı anlayarak, TypeScript kodunu JavaScript'e verimli bir şekilde dönüştürebilir ve çeşitli ortamlarda çalıştırabilirsiniz. Bu bilgi, TypeScript'in özelliklerinden en iyi şekilde yararlanmanıza ve geliştirme iş akışınızı geliştirmenize yardımcı olacaktır.