如何在angular-cli项目中升级Angular版本？

6 回答

• 1

  有用：使用官方角度更新指南选择您当前的版本以及您要升级到的版本以获取相关的升级指南 . https://update.angular.io/请参阅GitHub存储库Angular CLI diff以比较Angular CLI更改 . https://github.com/cexbrayat/angular-cli-diff/

  UPDATED 08/05/2018:

  Angular CLI 1.7引入了 ng update .

  ng update一个新的Angular CLI命令，有助于简化您的项目与最新版本的最新版本 . 软件包可以定义将应用于您的项目的逻辑，以确保使用最新功能以及进行更改以减少或消除与中断更改相关的影响 . 可以在此处找到ng update的配置信息

  1.7 to 6 update

  CLI 1.7不支持自动v6更新 . 通过包管理器手动安装@ angular / cli，然后运行更新迁移原理图以完成该过程 .

  npm install @angular/cli@^6.0.0
  ng update @angular/cli --migrate-only --from=1
  

  ---

  UPDATED 30/04/2017:

  1.0 Update

  你现在应该按照 Angular CLI migration guide

  ---

  UPDATED 04/03/2017:

  RC Update

  你应该按照 Angular CLI RC migration guide

  ---

  UPDATED 20/02/2017:

  请注意1.0.0-beta.32有重大更改并已删除 ng init and ng update

  拉请求here表示以下内容：

  BREAKING CHANGE：删除ng init＆ng update命令，因为它们当前的实现会导致比它解决的问题更多的问题 . 更新功能将返回CLI，直到需要手动更新应用程序 .

  angular-cli CHANGELOG.md陈述如下：

  突破性更改 - @ angular / cli：删除ng init＆ng update命令，因为它们当前的实现会导致比它解决的问题更多的问题 . 一旦RC发布，我们将不再需要使用这些更新，因为步骤将像安装最新版本的CLI一样简单 .

  ---

  UPDATED 17/02/2017:

  Angular-cli现已添加到NPM @angular包中 . 您现在应该使用以下命令替换上述命令 -

  Global package:

  npm uninstall -g angular-cli @angular/cli
  npm cache clean
  npm install -g @angular/cli@latest
  

  Local project package:

  rm -rf node_modules dist # On Windows use rmdir /s /q node_modules dist
  npm install --save-dev @angular/cli@latest
  npm install
  ng init
  

  ---

  ORIGINAL ANSWER

  您应该按照GitHub上README.md的步骤通过angular-cli更新角度 .

  他们来了：

  Updating angular-cli

  要将angular-cli更新为新版本，必须同时更新全局包和项目的本地包 .

  Global package:

  npm uninstall -g angular-cli
  npm cache clean
  npm install -g angular-cli@latest
  

  Local project package:

  rm -rf node_modules dist tmp # On Windows use rmdir /s /q node_modules dist tmp
  npm install --save-dev angular-cli@latest
  npm install
  ng init
  

  运行 ng init 将检查由ng new创建的所有自动生成文件的更改，并允许您更新自己的文件 . 每个更改的文件都有四个选项：y（覆盖），n（不覆盖），d（显示文件和更新文件之间的差异）和h（帮助） .

  仔细阅读每个代码文件的差异，并接受更改或在ng init完成后手动合并它们 .

  回复于 2024-04-29T14:18:04+08:00
• 2

  JJB的回答让我走上正轨，但升级并不顺利 . 我的流程详述如下 . 希望将来这个过程变得更加容易，并且可以使用JJB的答案或者更直接的答案 .

  解决方案详情

  我已按照JJB答案中捕获的步骤精确更新了角度cli . 然而，在运行 npm install 之后，angular-cli被打破了 . 即使尝试做 ng version 也会产生错误 . 所以我不能做 ng init 命令 . 见下面的错误：

  $ ng init
  core_1.Version is not a constructor
  TypeError: core_1.Version is not a constructor
      at Object.<anonymous> (C:\_git\my-project\code\src\main\frontend\node_modules\@angular\compiler-cli\src\version.js:18:19)
      at Module._compile (module.js:556:32)
      at Object.Module._extensions..js (module.js:565:10)
      at Module.load (module.js:473:32)
      ...
  

  为了能够使用任何angular-cli命令，我必须手动更新我的package.json文件并将@angular依赖项置于2.4.1，然后执行另一个 npm install .

  在此之后，我能够做到 ng init . 我更新了配置文件，但没有更新我的app / *文件 . 完成后，我仍然遇到错误 . 第一个详述如下，第二个是相同类型的错误，但在不同的文件中 .

  ERROR in Error遇到静态解析符号值 . 不支持函数调用 . 考虑使用对导出函数的引用替换函数或lambda（原始.ts文件中的位置62：9），在C：/ _ git / my-project / code / src / main / frontend / src / app中解析符号AppModule /app.module.ts

  此错误与AppModule中的以下工厂提供程序相关联

  { provide: Http, useFactory: 
      (backend: XHRBackend, options: RequestOptions, router: Router, navigationService: NavigationService, errorService: ErrorService) => {
      return new HttpRerouteProvider(backend, options, router, navigationService, errorService);  
    }, deps: [XHRBackend, RequestOptions, Router, NavigationService, ErrorService]
  }
  

  为解决此错误，我使用了导出的函数并对提供程序进行了以下更改 .

  { 
        provide: Http, 
        useFactory: httpFactory, 
        deps: [XHRBackend, RequestOptions, Router, NavigationService, ErrorService]
      }
  
  ... // elsewhere in AppModule
  
  export function httpFactory(backend: XHRBackend, 
                              options: RequestOptions, 
                              router: Router, 
                              navigationService: NavigationService, 
                              errorService: ErrorService) {
    return new HttpRerouteProvider(backend, options, router, navigationService, errorService);
  }
  

  摘要

  总结一下我理解的最重要的细节，需要进行以下更改：

  • 使用JJB答案（及其github页面）中详述的步骤更新angular-cli版本 .

  • 手动更新@angular版本，angular-cli版本1.0.0-beta.24似乎不支持2.0.0

  • 在angular-cli和 ng init 命令的帮助下，我更新了配置文件 . 我认为关键的变化是angular-cli.json和package.json . 请参阅底部的配置文件更改 .

  • 在我引用代码之前，将代码更改为导出函数，如解决方案详细信息中所示 .

  关键配置更改

  angular-cli.json改变了

  {
    "project": {
      "version": "1.0.0-beta.16",
      "name": "frontend"
    },
    "apps": [
      {
        "root": "src",
        "outDir": "dist",
        "assets": "assets",
  ...
  

  变成...

  {
    "project": {
      "version": "1.0.0-beta.24",
      "name": "frontend"
    },
    "apps": [
      {
        "root": "src",
        "outDir": "dist",
        "assets": [
          "assets",
          "favicon.ico"
        ],
  ...
  

  在考虑ng-init使用的版本的手动合并之后，我的package.json看起来像这样 . 注意我的角度版本不是2.4.1，但我之后的变化是2.3中引入的组件继承，所以我对这些版本没问题 . 最初的package.json就在问题中 .

  {
    "name": "frontend",
    "version": "0.0.0",
    "license": "MIT",
    "angular-cli": {},
    "scripts": {
      "ng": "ng",
      "start": "ng serve",
      "lint": "tslint \"src/**/*.ts\"",
      "test": "ng test",
      "pree2e": "webdriver-manager update --standalone false --gecko false",
      "e2e": "protractor",
      "build": "ng build",
      "buildProd": "ng build --env=prod"
    },
    "private": true,
    "dependencies": {
      "@angular/common": "^2.3.1",
      "@angular/compiler": "^2.3.1",
      "@angular/core": "^2.3.1",
      "@angular/forms": "^2.3.1",
      "@angular/http": "^2.3.1",
      "@angular/platform-browser": "^2.3.1",
      "@angular/platform-browser-dynamic": "^2.3.1",
      "@angular/router": "^3.3.1",
      "@angular/material": "^2.0.0-beta.1",
      "@types/google-libphonenumber": "^7.4.8",
      "angular2-datatable": "^0.4.2",
      "apollo-client": "^0.4.22",
      "core-js": "^2.4.1",
      "rxjs": "^5.0.1",
      "ts-helpers": "^1.1.1",
      "zone.js": "^0.7.2",
      "google-libphonenumber": "^2.0.4",
      "graphql-tag": "^0.1.15",
      "hammerjs": "^2.0.8",
      "ng2-bootstrap": "^1.1.16"
    },
    "devDependencies": {
      "@types/hammerjs": "^2.0.33",
      "@angular/compiler-cli": "^2.3.1",
      "@types/jasmine": "2.5.38",
      "@types/lodash": "^4.14.39",
      "@types/node": "^6.0.42",
      "angular-cli": "1.0.0-beta.24",
      "codelyzer": "~2.0.0-beta.1",
      "jasmine-core": "2.5.2",
      "jasmine-spec-reporter": "2.5.0",
      "karma": "1.2.0",
      "karma-chrome-launcher": "^2.0.0",
      "karma-cli": "^1.0.1",
      "karma-jasmine": "^1.0.2",
      "karma-remap-istanbul": "^0.2.1",
      "protractor": "~4.0.13",
      "ts-node": "1.2.1",
      "tslint": "^4.0.2",
      "typescript": "~2.0.3",
      "typings": "1.4.0"
    }
  }
  

  回复于 2024-04-29T14:18:04+08:00
• 4

  只需使用Angular CLI的内置功能即可

  ng update
  

  更新到最新版本 .

  回复于 2024-04-29T14:18:04+08:00
• 73

  根据这里的文件http://angularjs.blogspot.co.uk/2017/03/angular-400-now-available.html你'should'只能运行...

  npm install @ angular / {common，compiler，compiler-cli，core，forms，http，platform-browser，platform-browser-dynamic，platform-server，router，animations} @latest typescript @ latest --save

  由于我的zone.js和ngrx / store库是旧版本，我尝试了它并得到了一些错误 .

  将那些更新到最新版本 npm install zone.js@latest --save 和 npm install @ngrx/store@latest -save ，然后再次运行角度安装对我有用 .

  回复于 2024-04-29T14:18:04+08:00
• -1

  去掉 ：

  npm uninstall -g angular-cli
  

  重新安装（带纱线）

  # npm install --global yarn
  yarn global add @angular/cli@latest
  ng set --global packageManager=yarn  # This will help ng-cli to use yarn
  

  重新安装（使用npm）

  npm install --global @angular/cli@latest
  

  另一种方法是不使用全局安装，并在PATH中添加 /node_modules/.bin 文件夹，或使用npm脚本 . 升级会更软 .

  回复于 2024-04-29T14:18:04+08:00
• 0

  要将Angular CLI更新为新版本，必须同时更新全局包和项目的本地包 .

  Global package:

  npm uninstall -g @angular/cli
  npm cache clean
  npm install -g @angular/cli@latest
  

  Local project package:

  rm -rf node_modules dist # use rmdir /S/Q node_modules dist in Windows Command Prompt; use rm -r -fo node_modules,dist in Windows PowerShell
  npm install --save-dev @angular/cli@latest
  npm install
  

  参见参考资料https://github.com/angular/angular-cli

  回复于 2024-04-29T14:18:04+08:00