React Native Metro Bundler: Sürüm Çakışmasını ve Cache Temizliğini Anlamak

React Native projelerinde Metro bundler (kodu cihaza çeviren araç) sürüm uyumsuzluğu veya eski cache nedeniyle garip hatalar ortaya çıkabilir. Genellikle bağımlılık sürümleri güncellendikten sonra ya da proje geçişte kod değişmemiş olsa bile uygulama çöker veya eski kodu çalıştırır.

Problemin kökü: Metro cache'i (geçici bellekte saklanan derleme sonuçları) eski tutup, yeni sürüm ile uyumsuz hale gelmesidir. Ayrıca node_modules ve bundler sürümleri arasında çatışma ortaya çıkabilir.

İlk adım cache'i temizlemektir. Proje dizininde şu komutları sırasıyla çalıştır:

1rm -rf node_modules
2rm -rf ~/.gradle (Android için)
3rm -rf ~/Library/Developer/Xcode/DerivedData (iOS için)
4rm -rf $TMPDIR/react-native-packager-*
5npm install

Beklenen çıktı: Tüm bağımlılıklar temiz şekilde kurulacak, hiçbir eski dosya kalmayacak.

Android'de Metro'yu sıfırdan başlatmak için:

1cd android./gradlew clean
2cd..
3npx react-native start --reset-cache

Başka bir terminal penceresinde:

1npx react-native run-android

Beklenen çıktı: Metro bundler sıfır boş durum (clean state) ile başlayacak, tüm dosyalar yeniden derlenir.

Sürüm çakışmasını kontrol etmek için package.json'ı gözden geçir. React Native ve Metro'nun uyumlu versiyonlar olduğundan emin ol:

1{
2"dependencies": {
3"react": "18.2.0",
4"react-native": "0.72.0"
5},
6"devDependencies": {
7"@react-native/metro-config": "^0.72.0"
8}
9}

Sık yapılan hata: Cache temizlemeden sadece npm install çalıştırmak. Gradle cache (Android) veya Xcode türetilmiş veriler (iOS) eski kalır ve sorun devam eder. Her zaman tüm cache katmanlarını sil.

bknz: React Native Bridgeless Modu: Ne Zaman Aktif Etmeliyim