# Babel

Adres: https://softwaredictionary.org/tr/terimler/babel
Kategori: Web Geliştirme
Son güncelleme: 2026-10-06
Okunuşu: beybıl

Kısaca: Babel, modern JavaScript, JSX ve TypeScript sözdizimini eski tarayıcıların ve ortamların çalıştırabileceği koda çeviren bir JavaScript derleyicisidir.

## Babel nedir?

Babel bir transpiler'dır: kaynak kodu aynı düzeydeki başka bir kaynak koda dönüştüren bir araç. JavaScript kodunuzu okur, bir sözdizimi ağacına ayrıştırır, eklentilerin bu ağacı dönüştürmesine izin verir ve yeni kod üretir. 2014'te 6to5 adıyla, geliştiricilerin o zaman yeni olan ES6 sözdizimini yazıp eski tarayıcılarda da çalıştırmasını sağlayan bir araç olarak başladı ve 2015'te Babel adını aldı.

Her dönüşüm bir eklentidir (plugin), preset'ler de pek çoğunu bir araya getirir. `@babel/preset-env`, `> 0.5%, not dead` gibi bir Browserslist sorgusuna bakarak yalnızca hedef tarayıcılarınızda eksik olan sözdizimini derler; `@babel/preset-react` JSX'i fonksiyon çağrılarına dönüştürür; `@babel/preset-typescript` ise tip tanımlarını siler. Eklentiler hata ayıklama kodunu kaldırmak ya da test kapsamı sayaçları eklemek gibi özel işler de yapabilir; memoization'ı otomatik ekleyen React Compiler da bir Babel eklentisi olarak dağıtılır.

Haziran 2026'da, Babel 7'den sekiz yıl sonra yayımlanan Babel 8 yalnızca ES modülleri olarak dağıtılır, Node.js 22 ya da sonrasını gerektirir ve varsayılan olarak her şeyi ES5'e kadar derlemek yerine Browserslist'in `defaults` sorgusunu hedefler. Aynı yıllarda Babel'in günlük işlerinin büyük kısmı esbuild, SWC ve Oxc gibi Go ve Rust ile yazılmış daha hızlı araçlara geçti; Next.js ve Vite varsayılan olarak bunları kullanır. Babel ise eklentilerine ihtiyaç duyulan yerlerde yaygın olmaya devam ediyor.

Babel sık sık bir bundler ve bir polyfill ile karıştırılır. webpack gibi bir bundler pek çok dosyayı birkaç dosyada birleştirir ve `babel-loader` aracılığıyla her dosyada Babel'i çalıştırabilir; Babel'in kendisi ise her seferinde tek bir dosyayı dönüştürür. Babel optional chaining ya da class'lar gibi sözdizimini yeniden yazar, ama `Array.prototype.at` gibi eksik yerleşik fonksiyonları ekleyemez; bunlar core-js gibi polyfill'lerden gelir ve ayrı bir Babel eklentisi onları gereken yerlere ekleyebilir. Ayrıca TypeScript tiplerini kontrol etmeden siler; bu yüzden projeler tip hatalarını yakalamak için yine de `tsc` çalıştırır.

## Önemli noktalar

- Babel, yeni sözdizimini eski sözdizimine çeviren bir JavaScript transpiler'ıdır.
- Her dönüşümü bir eklenti yapar; `@babel/preset-env` gibi preset'ler onları bir araya getirir.
- JSX'i de derler ve TypeScript tiplerini, tip kontrolü yapmadan siler.
- Babel 8 (2026) yalnızca ESM olarak gelir ve varsayılan olarak modern tarayıcıları hedefler.
- Artık pek çok build'i SWC ve esbuild gibi daha hızlı araçlar üstleniyor; Babel, eklentilerine ihtiyaç duyulan yerlerde kalıyor.

## Örnek: React ve TypeScript projesi için bir babel.config.json

```json
{
  "presets": [
    ["@babel/preset-env", { "targets": "> 0.5%, not dead" }],
    "@babel/preset-react",
    "@babel/preset-typescript"
  ],
  "plugins": ["babel-plugin-react-compiler"]
}
```

## Sık sorulan sorular

**Babel'e hâlâ ihtiyaç var mı?**

Eskisinden daha az. Modern tarayıcılar güncel sözdiziminin neredeyse tamamını destekliyor; yeni projelerin çoğunda TypeScript ve JSX'i SWC, esbuild ve Oxc gibi daha hızlı araçlar işliyor. Babel, React Compiler gibi belirli bir eklentinin gerektiği yerlerde ve eski build kurulumlarında hâlâ kullanılıyor.

**Babel ile TypeScript derleyicisi arasındaki fark nedir?**

İkisi de TypeScript'i JavaScript'e dönüştürebilir. `tsc` tipleri de kontrol eder; Babel ise onları yalnızca siler, bunu da hızlıca ve her seferinde tek bir dosyada yapar. Pek çok proje kodu hızlı bir araca derletir ve `tsc --noEmit` komutunu yalnızca kontrol için çalıştırır.

**@babel/preset-env ne işe yarar?**

Hedeflediğiniz tarayıcılara ya da Node.js sürümlerine bakar ve yalnızca onların ihtiyaç duyduğu dönüşümleri uygular; böylece modern tarayıcılar için üretilen kod yazdığınıza yakın kalır.

## Kaynaklar

- [Babel documentation: What is Babel?](https://babeljs.io/docs/)
- [Babel blog: Releasing Babel 8 today: ESM-only, drop ES5 default, and a smooth migration path](https://babeljs.io/blog/2026/06/16/8.0.0)

---

Software Dictionary: https://softwaredictionary.org/tr · https://softwaredictionary.org/tr/llms.txt