Açısal 2'yi (npm) en son sürüme nasıl doğru bir şekilde yükseltirim?

Son zamanlarda https://angular.io/docs/ts/latest/tutorial/ adresinde Angular 2 eğitimine başladım .

ve Angular 2 beta 8 ile bırakıldı. Şimdi eğiticiye devam ettim ve en son beta beta 14.

Basitçe npm güncellemesi yaparsam , birkaç modül (öğretici ile önceden yüklenmiş) güncellenir ancak Angular2 güncellenmez (bunu npm ls ile görebiliyorum ).

Ben yaparsanız 2 açısal npm güncelleştirme veya npm güncelleme angular2@2.0.0beta.14 hiçbir şey ya tıpkı.

Komut npm update -D && npm update -S, içindeki tüm paketleri , tanımlanan sürüm aralıklarına görepackage.json en son sürümlerine güncelleyecektir . Bu konuda daha fazla bilgi bulabilirsiniz burada .

Angular'ı önceki bir sürümden güncellemek istiyorsanız , Angular birkaç npm modülüne bölündüğünden 2.0.0-rc.1manuel olarak düzenlemeniz gerekir package.json. Bu olmadan, olarak angular2 için paket noktaları 2.0.0-beta.21, sen açısal son sürümünü kullanmak olsun asla.
Başlamak için ihtiyaç duyacağınız en yaygın modüllerden bazılarını içeren bir liste, hızlı başlangıç ​​havuzunda bulunabilir .

Notlar:

• Paketlerinizin en son sürümüyle güncel kalmanın harika bir yolu,npm outdated tüm güncel olmayan paketleri aranan ve en son sürümleriyle birlikte gösteren kullanmaktır .

• Biz zincirine iki komutları ihtiyaç nedeni npm update -Dile npm update -Süstesinden gelmektir bu hatayı o düzeltilenekadar.

Angular2'nin beta sürümünden geçiş yapmak için kullandığım bir başka güzel paket Angular2 2.0.0 finalisenpm-check-updates

Package.json içinde belirtilen tüm paketlerin en son sürümünü gösterir. Bunun aksine npm outdated, package.json dosyanızı düzenleyebilir ve npm upgradedaha sonra yapmanıza olanak tanır .

Yüklemek

sudo npm install -g npm-check-updates

kullanım

ncusergilemek için

ncu -u package.json dosyanızı yeniden yazmak için

En son Angular 5'e yükseltin

Açısal Dep paketleri: npm install @angular/{animations,common,compiler,core,forms,http,platform-browser,platform-browser-dynamic,router}@latest --save

Açısal cli tarafından kurulan diğer paketler npm install --save core-js@latest rxjs@latest zone.js@latest

Açısal Geliştirme paketleri: npm install --save-dev @angular/{compiler-cli,cli,language-service}@latest

Geliştirme paketleri türleri: npm install --save-dev @types/{jasmine,jasminewd2,node}@latest

Açısal cli tarafından dev olarak kurulan diğer paketler: npm install --save-dev codelyzer@latest jasmine-core@latest jasmine-spec-reporter@latest karma@latest karma-chrome-launcher@latest karma-cli@latest karma-coverage-istanbul-reporter@latest karma-jasmine@latest karma-jasmine-html-reporter@latest protractor@latest ts-node@latest tslint@latest

Angular cli tarafından kullanılan desteklenen en son sürümü yükleyin (@ sonest yapmayın): npm install --save-dev typescript@2.4.2

Angular-cli.json dosyasını .angular-cli.json olarak yeniden adlandırın ve içeriği güncelleyin:

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "project": {
    "name": "project3-example"
  },
  "apps": [
    {
      "root": "src",
      "outDir": "dist",
      "assets": [
        "assets",
        "favicon.ico"
      ],
      "index": "index.html",
      "main": "main.ts",
      "polyfills": "polyfills.ts",
      "test": "test.ts",
      "tsconfig": "tsconfig.app.json",
      "testTsconfig": "tsconfig.spec.json",
      "prefix": "app",
      "styles": [
        "styles.css"
      ],
      "scripts": [],
      "environmentSource": "environments/environment.ts",
      "environments": {
        "dev": "environments/environment.ts",
        "prod": "environments/environment.prod.ts"
      }
    }
  ],
  "e2e": {
    "protractor": {
      "config": "./protractor.conf.js"
    }
  },
  "lint": [
    {
      "project": "src/tsconfig.app.json",
      "exclude": "**/node_modules/**"
    },
    {
      "project": "src/tsconfig.spec.json",
      "exclude": "**/node_modules/**"
    },
    {
      "project": "e2e/tsconfig.e2e.json",
      "exclude": "**/node_modules/**"
    }
  ],
  "test": {
    "karma": {
      "config": "./karma.conf.js"
    }
  },
  "defaults": {
    "styleExt": "css",
    "component": {}
  }
}

GÜNCELLEME: CLI v6'dan
başlayarak, bağımlılıklarınızın otomatik olarak yeni bir sürüme güncellenmesini sağlamak için çalıştırabilirsiniz .ng update

İle ng updateBazen eklemek isteyebilirsiniz --forcebayrağı. Bunu yaparsanız, bu şekilde yüklediğiniz typcript sürümünün mevcut açısal sürümünüz tarafından desteklendiğinden emin olun, aksi takdirde typcript sürümünü eski sürüme geçirmeniz gerekebilir.

Ayrıca Angular projelerinizi güncelleme bu kılavuzu inceleyin

İçin bash kullanıcıları sadece

Eğer açıksanız Mac/Linuxveya bash on çalıştırıyorsanız Windows(bu, varsayılan olarak çalışmaz Windows CMD), o oneliner'ı çalıştırabilirsiniz:

npm install @angular/{animations,common,compiler,core,forms,http,platform-browser,platform-browser-dynamic,router,compiler-cli}@4.4.5 --save

yarn add @angular/{animations,common,compiler,core,forms,http,platform-browser,platform-browser-dynamic,router,compiler-cli}@4.4.5

İstemediğiniz sürümü belirtmeniz yeterlidir, örneğin @ 4.4.5 veya en son sürümü almak için @ en geç

package.jsonYalnızca @angular/*uygulamanızın güvendiği tüm paketleri güncellediğinizden emin olmak için kontrol edin

• @angularProjenizin tam sürümünü görmek için:
  npm ls @angular/compilerveyayarn list @angular/compiler
• @angularNpm çalıştırmada mevcut olan en son kararlı sürümü kontrol etmek için :
  npm show @angular/compiler version

Resmi npm sayfası, hem küresel hem de yerel senaryolar için açısal sürümü güncellemek için yapılandırılmış bir yöntem önerir.

1. Her şeyden önce, mevcut açıyı sisteminizden kaldırmanız gerekir.

npm uninstall -g angular-cli
npm uninstall --save-dev angular-cli
npm uninstall -g @angular/cli

2. Önbelleği temizleyin

npm cache clean

DÜZENLE

@Candidj tarafından belirtildiği gibi

npm cache cleannpm cache verifynpm 5'ten itibaren olarak yeniden adlandırıldı

3. Global olarak açısal yükleyin

npm install -g @angular/cli@latest

4. Varsa yerel proje kurulumu

rm -rf node_modules
npm install --save-dev @angular/cli@latest
npm install

Lütfen aşağıdaki bağlantıda aynı şeyi kontrol edin:

https://www.npmjs.com/package/@angular/cli#updating-angular-cli

Bu sorunu çözecektir.

Npm-upgrade kullanarak alternatif yaklaşım :

1. npm i -g npm-upgrade

Proje klasörünüze gidin

2. npm-upgrade check

Paketi yükseltmek isteyip istemediğinizi soracaktır, Evet'i seçin

Bu basit

Tüm paketleri en son sürüme kurmak / yükseltmek istiyorsanız ve Windows çalıştırıyorsanız, bunu şurada kullanabilirsiniz powershell.exe:

foreach($package in @("animations","common","compiler","core","forms","http","platform-browser","platform-browser-dynamic","router")) {
    npm install @angular/$package@latest -E
}

Ayrıca kullanıyorsanız cli, bunu yapabilirsiniz:

foreach($package in @('animations','common','compiler','core','forms','http','platform-browser','platform-browser-dynamic','router', 'cli','compiler-cli')){
    iex "npm install @angular/$package@latest -E $(If($('cli','compiler-cli').Contains($package)){'-D'})";
}

Bu, paketleri tam olarak (-E) ve cli paketlerini devDependencies(-D) olarak kaydedecektir.

Buradan başlayın:

https://update.angular.io

Kullandığınız sürümü seçin ve size adım adım rehberlik edecektir.

Tüm adımları görmek için 'Gelişmiş'i seçmenizi tavsiye ederim. Karmaşıklık göreceli bir kavramdır - ve bu özelliğin kimin aptalca fikrini bilmiyorum, ancak 'Temel'i seçerseniz, size gereken tüm adımları göstermez ve aksi takdirde' Temel 'uygulamanızın kullandığı önemli bir şeyi gözden kaçırabilirsiniz. .

Sürüm 6'dan itibaren, ng updatebağımlılıklarınızı akıllıca gözden geçiren ve doğru şeyleri güncellediğinizden emin olmak için kontroller yapan yeni bir Angular CLI komutu var :-)

Adımlar nasıl kullanılacağını özetleyecektir :-)

npm uninstall --save-dev açısal-cli

npm install --save-dev @ angular / cli @ en son

ng güncelleme @ angular / cli

ng güncelleme @ açısal / çekirdek --force

ng güncellemesi @ açısal / malzeme veya npm i @ açısal / cdk @ 6 @ açısal / malzeme @ 6 - kaydet

npm yükleme türlericript @ '> = 2.7.0 <2.8.0'

Bunu yapmanın en iyi yolu, vscode içinde uzantıyı (pflannery.vscode-versionlens) kullanmaktır.

bu, tüm tatmin olup olmadığını kontrol eder ve en iyi uyumu kontrol eder.

Uygulamamı güncelleme ve çalıştırmayla ilgili birçok sorun yaşadım, kontrolü ayrıntılı lens yapmasına izin verdim ve sonra çalıştırdım

npm ben

yeni önerilen bağımlılıkları yüklemek için.

Projenizi en son sürümüne güncellemek için benim gibi arıyorsanız, bunlar Angular 6'dan beri benden işe yarıyor:

Konsolu proje klasörünüzde açın: If you type: ng updateardından aşağıdaki mesajı alacaksınız:

        We analyzed your package.json, there are some packages to update:

          Name                               Version                  Command to update
         --------------------------------------------------------------------------------
          @angular/cli                       7.0.7 -> 7.2.2           ng update @angular/cli
          @angular/core                      7.0.4 -> 7.2.1           ng update @angular/core

There might be additional packages that are outdated.
    Run "ng update --all" to try to update all at the same time.

Bu yüzden genellikle düz gidiyorum ve şunu yapıyorum:

ng update --all

Son olarak yeni sürümünüzü kontrol edebilirsiniz:

ng version

Angular CLI: 7.2.2
Node: 8.12.0
OS: win32 x64
Angular: 7.2.1
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.12.2
@angular-devkit/build-angular     0.12.2
@angular-devkit/build-optimizer   0.12.2
@angular-devkit/build-webpack     0.12.2
@angular-devkit/core              7.2.2
@angular-devkit/schematics        7.2.2
@angular/cli                      7.2.2
@ngtools/webpack                  7.2.2
@schematics/angular               7.2.2
@schematics/update                0.12.2
rxjs                              6.3.3
typescript                        3.2.4
webpack                           4.28.4