Angular CLI Sürüm Güncelleme (Update) Nasıl Yapılır?

İngilizce'ye Geç
Kısa Özet: Angular CLI Nasıl Güncellenir?

Angular CLI güncellemesi yapmak için öncelikle mevcut global sürümü bilgisayardan tamamen kaldırmalısınız. Sırasıyla şu adımları izleyin: 1) Eski sürümü kaldırın (npm uninstall -g @angular/cli). 2) NPM önbelleğini temizleyin (npm cache clean --force). 3) En güncel sürümü global olarak yükleyin (npm install -g @angular/cli@latest). Eğer proje bazlı (local) bir uyuşmazlık yaşıyorsanız, projedeki node_modules klasörünü silip projeyi baştan güncelleyerek npm install çalıştırmanız gerekir.

Bir Angular projesini veya doğrudan bilgisayarınızdaki (Global) Angular CLI aracını güncellemek, NPM paket bağımlılıkları (Dependencies) yüzünden bazen tam bir kaosa dönüşebilir. "Your global Angular CLI version is greater than your local version" gibi hatalar alıyorsanız doğru yerdesiniz. Bu yazıda Angular CLI nasıl güncellenir, global ve lokal versiyon farklılıkları nasıl giderilir ve karşılaşılan yaygın hataları nasıl çözeceğinizi adım adım öğreneceksiniz.

İlgili İçerik: Angular projenizi güncelleyip (build aldıktan) sonra sunucuya yüklerken, sayfayı yenilediğinizde (F5) 404 hatası alıyorsanız Angular Nginx Deployment ve Routing 404 Çözümü rehberimize mutlaka göz atmalısınız.

1. Angular Güncellerken Altın Kurallar

Angular projelerini güncellerken dikkat etmeniz gereken en hayati kural, sürümleri doğrudan en tepeye zıplatmamaktır. NPM paketleri arasındaki ciddi mimari değişiklikler projeyi tamamen bozabilir.

  • Sırayla Atlayın: Örneğin Angular 10 kullanıyorsanız direkt 15'e geçmeyin. Önce 11 → 12 → 13 şeklinde kademeli (step-by-step) ilerleyin.
  • Resmi Güncelleme Rehberini Kullanın: Hangi sürümden hangisine geçeceğinizi yazarak kod değişikliklerini anlatan resmi update.angular.io sitesini mutlaka inceleyin.
  • Yedek (Backup) Alın: İşleme başlamadan önce projeyi mutlaka Git'e commit edin (veya manuel kopyasını alın).

2. Angular CLI Versiyon Kontrolü

İlk adım olarak bilgisayarınızda hangi Angular CLI sürümünün kurulu olduğunu öğrenin. Terminali açın ve şu komutu yazın:

ng --version

Bu komut size Node.js sürümünüzü, RxJS sürümünüzü ve işletim sistemi mimarinizle birlikte Angular versiyonunuzu detaylı bir şekilde gösterecektir.

Angular version kontrol ng --version terminal çıktısı

3. Angular CLI Global Güncelleme

Bilgisayarınızdaki ana Angular CLI aracını (Global) en güncel sürüme yükseltmek için aşağıdaki adımları terminal (Windows için CMD/PowerShell, Mac/Linux için Terminal) üzerinden sırasıyla çalıştırın:

Adım 3.1: Eski Angular CLI'yi Kaldırın

# Windows Kullanıcıları İçin
npm uninstall -g @angular/cli

# Linux/Mac Kullanıcıları İçin (Yetki gerekebilir)
sudo npm uninstall -g @angular/cli

Adım 3.2: Cache (Önbellek) Temizliği

Eski sürümün bilgisayarda kalıntı bırakmaması için NPM önbelleğini temizlemek zorunludur:

npm cache clean --force

Adım 3.3: Yeni Sürümü Yükleyin

Şimdi en güncel Angular sürümünü bilgisayarımıza küresel çapta (global) indiriyoruz:

npm install -g @angular/cli@latest
İpucu: Belirli bir versiyona geçmek istiyorsanız (Örn: Angular 14), komutu npm install -g @angular/cli@14 şeklinde çalıştırabilirsiniz. Bağımlılık (dependency) hataları alırsanız sonuna --force ekleyin.

4. Angular CLI Lokal (Proje İçi) Güncelleme

Eğer projenizi ayağa kaldırmaya çalışırken terminalde kırmızı harflerle şu meşhur uyarıyı alıyorsanız:

Your global Angular CLI version (15.0.0) is greater than your local version (12.0.0)

Bu, bilgisayarınızın güncel olduğu ancak çalıştığınız projenin eski sürümde kaldığı anlamına gelir. Sadece o projeyi güncellemek için proje klasörünün içine terminalden girin ve şu sırayı izleyin:

  1. Node_modules klasörünü silin: (Linux/Mac: rm -rf node_modules | Windows: Manuel silin)
  2. Eski CLI paketini projeden kaldırın:
    npm uninstall --save-dev @angular/cli
  3. Yeni CLI sürümünü projeye ekleyin:
    npm install --save-dev @angular/cli@latest
  4. Bağımlılıkları yeniden yükleyin:
    npm install

5. Projeyi Derleme ve Çalıştırma

Tüm güncelleme işlemleri bittikten sonra projenin sorunsuz derlenip derlenmediğini kontrol etmek için yerel geliştirme sunucusunu ayağa kaldırın:

ng serve

Eğer "Compiled successfully" yazısını görüyorsanız, Angular projeniz başarıyla yeni sürüme taşınmış demektir.

6. Yaygın Hatalar ve Kesin Çözümleri

Module Build Failed Hatası

Sürüm yükseltmelerinde en sık karşılaşılan NPM kütüphane çökmesidir:

./node_modules/... Module build failed

Çözüm: Angular Build mekanizmasını ve CDK (Component Dev Kit) kütüphanesini manuel olarak tekrar kurun:

npm i @angular-devkit/build-angular
npm i @angular/cdk --force

Peer Dependency (NPM ERR! ERESOLVE) Hatası

Eğer üçüncü parti bir kütüphane (Örn: Bootstrap veya PrimeNG), geçmeye çalıştığınız yeni Angular sürümünü henüz desteklemiyorsa bu hatayı alırsınız.

Çözüm: Riski göze alarak uyumsuzluk testlerini atlayın ve zorla yükleyin:

npm install --legacy-peer-deps

7. Sık Sorulan Sorular (SSS)

Neden ng update komutu yerine npm uninstall kullanıyoruz?

Angular'ın resmi ng update komutu genellikle küçük (minor) güncellemelerde işe yarar. Ancak aradaki sürüm farkı çok fazlaysa veya projenin içi karışmışsa (node_modules bozulmuşsa), tertemiz bir başlangıç yapmak için eski paketi npm uninstall ile silip sıfırdan indirmek (Clean Install) her zaman en sağlıklı yöntemdir.

Angular projesini direkt en son sürüme güncellesem ne olur?

Büyük ihtimalle uygulamanız çökecektir. Angular'ın her yeni sürümünde bazı eski komutlar (Deprecated) tamamen kaldırılır veya Typescript sürümleri değiştirilir. Vites atlar gibi kademeli güncellemek kodlarınızın uyum sağlamasını kolaylaştırır.

Sonuç

Angular projelerini güncellemek, NPM bağımlılıkları yüzünden bazen sabır sınayan bir sürece dönüşebilir. Ancak bu rehberde bahsettiğimiz gibi; node_modules temizliği yapmak, global ve lokal (proje içi) CLI versiyonlarını eşitlemek ve kademeli (step-by-step) güncelleme mantığını benimsemek bu sürecin hasarsız atlatılmasını sağlayacaktır. Güncel teknolojilerle ve sağlıklı projelerle kodlamaya devam edin!

Etiketler: angular cli güncelleme, angular update, npm cache clean, module build failed, frontend

Son Güncelleme: 2026

Latest Software Developers - Yazılım Blog Yazarı Profil Resmi

Yazar

LatestSoftwareDevelopers

Güncel yazılım teknolojilerinin takip edildiği blog.

FrontEnd ile ilgili yorumlar

Yorum Paylaş

EMail Zorunlu alanlar * *