0Pricing
TypeScript Academy · Ders

TypeScript'i JavaScript'e Derleme

TypeScript derleyicisini ve oluşturduğu çıktıyı öğrenin.

TypeScript'i JavaScript'e Derleme, CoddyKit'te ücretsiz bir TypeScript Academy dersidir. Bu, 4 dersinin 3. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, TypeScript Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. TypeScript Academy kursu toplamda 4 dersten oluşur.

Hoş Geldiniz

TypeScript doğrudan Node.js'te veya tarayıcıda çalışamaz. Önce JavaScript'e derlenmelidir. Bu derste TypeScript derleyicisinin nasıl çalıştığını öğreneceksiniz.

TypeScript Derleyicisini Kurma

TypeScript'i projenize bir geliştirme bağımlılığı olarak kurun. Kurulumdan sonra `tsc` komutu yerel betiklerinizde kullanılabilir hâle gelir.
npm install --save-dev typescript
npx tsc --version

İlk tsc Derlemeniz

Tek bir dosyayı derlemek için `tsc hello.ts` komutunu çalıştırın. Bu komut, tüm türlerin kaldırıldığı `hello.js` dosyasını aynı dizinde üretir.
// hello.ts
function greet(name: string): string {
  return 'Hello, ' + name;
}
console.log(greet('World'));

// Compile: npx tsc hello.ts
// Output: hello.js (no types)

tsconfig.json: Proje Yapılandırması

Gerçek bir proje için bir `tsconfig.json` dosyasına ihtiyacınız vardır. Bir dosya oluşturmak için `tsc --init` komutunu çalıştırın. Bu dosya hedefi, modül biçimini, katılığı, çıktı dizinini ve daha fazlasını denetler.
npx tsc --init
// Creates tsconfig.json with defaults and comments

Temel Proje Yapılandırması Seçenekleri

En önemli proje yapılandırması alanları hedef (çıktıdaki ES sürümü), modül (modül sistemi), outDir (çıktı klasörü) ve katı (tüm katı denetimleri etkinleştirir) seçenekleridir.
{
  "compilerOptions": {
    "target": "ES2020",
    "module": "commonjs",
    "outDir": "./dist",
    "strict": true
  }
}

tsc --watch ile İzleme Kipi

Bir TypeScript dosyasını her kaydettiğinizde otomatik olarak yeniden derlemek için `tsc --watch` komutunu çalıştırın. Bu, geliştirme döngüsünü hızlandırır.
npx tsc --watch
// Watches for changes and recompiles on save

noEmit: Dosya Üretmeden Tür Denetimi

`noEmit` bayrağı, herhangi bir çıktı dosyası yazmadan tür denetleyicisini çalıştırır. Bu, gerçek derleme için Vite veya esbuild gibi bir paketleyici kullanan sürekli tümleştirme işlem hatlarında yararlıdır.
// tsconfig.json
{ "compilerOptions": { "noEmit": true } }

// Then run:
npx tsc --noEmit

Daha Hızlı Seçenekler: ts-node ve tsx

Geliştirme sırasında TypeScript'i ayrı bir derleme adımı olmadan `ts-node` veya daha hızlı `tsx` aracıyla doğrudan çalıştırabilirsiniz.
# Run TS directly with ts-node
npx ts-node src/index.ts

# Or faster with tsx
npx tsx src/index.ts

Hata Ayıklama için Kaynak Eşlemeleri

Tarayıcı geliştirme araçlarının ve Node.js hata ayıklayıcılarının derlenmiş JS satırlarını özgün TypeScript kaynağınıza eşlemesi için `sourceMap: true` seçeneğini etkinleştirin.
{ "compilerOptions": { "sourceMap": true } }

Bildirim Dosyaları (.d.ts)

`declaration: true` seçeneğiyle derleyici `.d.ts` dosyalarını da üretir. Bunlar, diğer TypeScript projelerinin kitaplığınızı tam tür bilgisiyle kullanmasına olanak tanır.
{ "compilerOptions": { "declaration": true } }
// Outputs: dist/index.js AND dist/index.d.ts

Derleyici Hataları Varsayılan Olarak Çıktıyı Engeller

Varsayılan olarak TypeScript kodunuzda tür hataları varsa `tsc` yine de JavaScript çıktısı üretir, ancak sıfır olmayan bir kodla çıkar. Hatalarda çıktıyı durdurmak için `noEmitOnError: true` seçeneğini kullanın.
{ "compilerOptions": { "noEmitOnError": true } }

Hızlı Denetim

`tsc --noEmit` komutunu çalıştırmak ne işe yarar?

Özet

TypeScript derleyicisi .ts dosyalarını JavaScript'e dönüştürür. Derleyiciyi tsconfig.json ile yapılandırın; geliştirme için --watch, yalnızca tür denetimi için --noEmit ve TypeScript'i doğrudan çalıştırmak için ts-node/tsx kullanın.

Sıkça Sorulan Sorular

“TypeScript'i JavaScript'e Derleme” dersi ücretsiz mi?

Evet — “TypeScript'i JavaScript'e Derleme” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve TypeScript Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. TypeScript Academy kursu toplamda 4 dersten oluşur.

“TypeScript'i JavaScript'e Derleme” dersinde ne öğreneceğim?

TypeScript derleyicisini ve oluşturduğu çıktıyı öğrenin. TypeScript Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

TypeScript Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te TypeScript Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 3. dersidir.

“TypeScript'i JavaScript'e Derleme” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu TypeScript Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her TypeScript Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

  1. JavaScript'in Zorlayıcı Yönleri: Çalışma Zamanı Hataları
  2. TypeScript JavaScript'e Ne Katar
  3. TypeScript'i JavaScript'e Derleme
  4. Projelerinizde TypeScript Ne Zaman Kullanılmalı
← TypeScript Academy Sayfasına Dön