如何正确将角度2(npm)升级到最新版本？

Question

最近我在https://angular.io/docs/ts/latest/tutorial/上开始了Angular 2教程.

然后我继续使用Angular 2 beta 8.现在我恢复了教程,最新的测试版是beta 14.

如果我只是更新npm更新一些模块(预装了教程)更新但不是Angular2(我可以看到npm ls).

如果我做npm更新角度2或npm更新angular2@2.0.0beta.14它也没有做任何事情.

Answer 1

该命令npm update -D && npm update -S将根据其定义的版本范围将所有包内更新package.json到其最新版本.你可以在这里阅读更多相关信息.

如果你想从之前的版本更新Angular 2.0.0-rc.1,那么你需要手动编辑package.json,因为Angular被分成几个npm模块.如果没有这个,就像angular2包指向的那样2.0.0-beta.21,你永远不会使用最新版本的Angular.
您可以在快速入门存储库中找到包含一些最常见模块的列表.

笔记:

• 一个很酷的方式来保持最新的软件包的最新版本是使用npm outdated它显示所有过时的软件包以及他们想要的和最新版本.

• 为什么我们需要链两个命令,原因npm update -D和npm update -S为克服这一缺陷,直到它的固定.

Answer 2

另外一个不错的包,我用于迁移形式Angular2的测试版本Angular2 2.0.0 final是npm-check-updates

它显示了package.json中指定的所有软件包的最新可用版本.相比之下,npm outdated它还能够编辑你的package.json,让你npm upgrade以后再做.

安装

sudo npm install -g npm-check-updates

用法

ncu用于显示

ncu -u 重写你的package.json

Answer 3

升级到最新的Angular 5

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

由角度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

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

Answer 4

更新:
从CLI v6开始,您可以运行ng update以便将依赖项自动更新为新版本.

随着ng update有时你可能需要添加--force标志.如果这样做,请确保您当前的角度版本支持以这种方式安装的打字稿版本,否则您可能需要降级打字稿版本.

另请查看本指南更新Angular项目

仅限bash用户

如果你正在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 run上可用的最新稳定版本:
  npm show @angular/compiler version

Answer 5

官方的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 verify从下午5点开始重命名

3.全局安装角度

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

这将解决问题.