[npm] Angular 2 (npm)를 최신 버전으로 올바르게 업그레이드하려면 어떻게해야합니까?

Program / 글쓴이

최근에 https://angular.io/docs/ts/latest/tutorial/ 에서 Angular 2 튜토리얼을 시작했습니다 .

Angular 2 베타 8로 중단했습니다. 이제 자습서를 다시 시작했으며 최신 베타는 베타 14입니다.

단순히 npm 업데이트 를 수행 하면 (튜토리얼과 함께 미리로드 된) 몇 개의 모듈이 업데이트되지만 Angular2는 업데이트되지 않습니다 ( npm ls 를 사용하면 알 수 있습니다 ).

내가 할 경우 2 각도 NPM 갱신 또는 NPM 업데이트 angular2@2.0.0beta.14을 그것은 아무 것도 하나를하지 않습니다 만.

답변

이 명령 npm update -D && npm update -S은 정의 된 버전 범위 에 따라 내부의 모든 패키지 package.json를 최신 버전으로 업데이트합니다 . 여기에서 자세한 내용을 읽을 수 있습니다 .

이전 버전에서 Angular를 업데이트 2.0.0-rc.1하려면 package.jsonAngular가 여러 npm 모듈로 분할되었으므로 수동으로 편집해야 합니다. 이것이 없으면 angular2 패키지가를 가리 키 2.0.0-beta.21므로 최신 버전의 Angular를 사용할 수 없습니다.

시작하는 데 필요한 가장 일반적인 모듈 목록은 빠른 시작 저장소 에서 찾을 수 있습니다 .

노트:

  • 패키지의 최신 버전을 최신 상태로 유지하는 멋진 방법npm outdated 은 모든 오래된 패키지를 원하는 최신 버전과 함께 표시 하는 사용 입니다.

  • 우리가 체인에 두 명령을해야하는 이유 npm update -D및 npm update -S극복하는 것입니다 이 버그 가 해결 될 때까지.

답변

Angular2의 베타 버전을 마이그레이션하는 데 사용한 또 다른 멋진 패키지 Angular2 2.0.0 final는npm-check-updates

package.json 내에 지정된 모든 패키지의 사용 가능한 최신 버전을 보여줍니다. 반대로 npm outdatedpackage.json을 편집 할 수도 있으므로 npm upgrade나중에 수행 할 수 있습니다 .

설치

sudo npm install -g npm-check-updates

용법

ncu디스플레이 용

ncu -u package.json을 다시 작성하기 위해

답변

최신 Angular 5로 업그레이드

Angular Dep 패키지 :
npm install @angular/{animations,common,compiler,core,forms,http,platform-browser,platform-browser-dynamic,router}@latest --save

Angular CLI에서 설치하는 기타 패키지
npm install --save core-js@latest rxjs@latest zone.js@latest

Angular Dev 패키지 :
npm install --save-dev @angular/{compiler-cli,cli,language-service}@latest

유형 개발 패키지 :
npm install --save-dev @types/{jasmine,jasminewd2,node}@latest

각도 CLI에 의해 dev dev로 설치되는 기타 패키지 :
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에서 사용하는 최신 지원 버전을 설치합니다 (@latest는하지 마십시오) :
npm install --save-dev typescript@2.4.2

angular-cli.json 파일의 이름을 .angular-cli.json으로 바꾸고 콘텐츠를 업데이트합니다.

{
  "$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": {}
  }
}

답변

업데이트 : CLI v6
부터는 종속성을 새 버전으로 자동 업데이트하기 위해 실행할 수 있습니다 .ng update

함께 ng update때때로 당신은 추가 할 수 있습니다 --force플래그를. 이렇게하면이 방식으로 설치 한 typescript 버전이 현재 각도 버전에서 지원되는지 확인합니다. 그렇지 않으면 typescript 버전을 다운 그레이드해야 할 수 있습니다.

이 가이드도 확인 하십시오 Angular 프로젝트 업데이트

들어 bash는 사용자 만

on 상태 Mac/Linux이거나 bash on Windows(기본값에서는 작동하지 Windows CMD않음)을 실행중인 경우 해당 oneliner를 실행할 수 있습니다.

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

@ 4.4.5와 같이 원하지 않는 버전을 지정하거나 @latest를 입력하여 최신 정보를 얻으십시오.

당신을 확인 package.json단지 당신이 모든 업데이트 할 수 있도록 @angular/*당신이 응용 프로그램에 의존되는 패키지를

  • @angular프로젝트 실행에서 정확한 버전 을 보려면 :
    npm ls @angular/compiler또는yarn list @angular/compiler
  • @angularnpm에서 사용 가능한 최신 안정 버전 을 확인하려면 다음을 실행하십시오.
    npm show @angular/compiler version

답변

공식 npm 페이지는 글로벌 및 로컬 시나리오 모두에 대해 각도 버전을 업데이트하는 구조화 된 방법을 제안합니다.

1. 우선, 시스템에서 현재 각도를 제거해야합니다.

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

2. 캐시 정리

npm cache clean

편집하다

@candidj가 지적한대로

npm cache cleannpm cache verifynpm 5 이후 로 이름이 변경 되었습니다.

3. Angular를 전역으로 설치

npm install -g @angular/cli@latest

4. 로컬 프로젝트 설정 (있는 경우)

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

아래 링크에서 동일한 내용을 확인하십시오.

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

이것은 문제를 해결할 것입니다.

답변

npm-upgrade를 사용하는 대체 방법 :

  1. npm i -g npm-upgrade

프로젝트 폴더로 이동

  1. npm-upgrade check

패키지 업그레이드 여부를 묻는 메시지가 표시되면 예를 선택합니다.

간단합니다

답변

모든 패키지를 최신 버전으로 설치 / 업그레이드하고 Windows를 실행중인 경우 다음에서 사용할 수 있습니다 powershell.exe.

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

를 사용하는 cli경우 다음을 수행 할 수 있습니다.

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'})";
}

이것은 정확한 패키지 (-E)와 cli 패키지를 devDependencies(-D)에 저장합니다.