Angular 升级到 Angular 4 后路由不工作

Question

我是这样更新的，found here

On Linux/Mac: npm install @angular/{common,compiler,compiler-cli,core,forms,http,platform-browser,platform-browser-dynamic,platform-server,router,animations}@latest typescript@latest --save

当我删除 node_modules 然后 npm install 我明白了，

WARNING in ./~/@angular/core/@angular/core.es5.js 5889:15-36 Critical dependency: the request of a dependency is an expression

也许这会帮助别人帮助我。似乎是 ES5 的问题？

控制台中的当前错误。

背景

在我昨晚升级到 Angular 4 之前，我的项目运行良好。现在，当我单击 link 而不是加载模块（我是延迟加载）时，它告诉我找不到该模块。

错误

ZoneAwareError {__zone_symbol__error: Error: Uncaught (in promise): Error: Cannot find module './benefits/benefits.module'. Error: Cannot ……}

有没有其他人分享过这种情况，或者知道如何解决这个问题，或者知道如何解决这个问题？我认为 Angular 4?

中没有重大变化

代码示例

package.json

{
  "name": "my-web-application",
  "version": "0.0.0",
  "license": "MIT",
  "angular-cli": {},
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
"private": true,
  "dependencies": {
    "@angular/animations": "^4.0.0",
    "@angular/common": "^4.0.0",
    "@angular/compiler": "^4.0.0",
    "@angular/compiler-cli": "^4.0.0",
    "@angular/core": "^4.0.0",
    "@angular/forms": "^4.0.0",
    "@angular/http": "^4.0.0",
    "@angular/platform-browser": "^4.0.0",
    "@angular/platform-browser-dynamic": "^4.0.0",
    "@angular/platform-server": "^4.0.0",
    "@angular/router": "^4.0.0",
    "angular2-jwt": "^0.1.28",
    "angular2-signaturepad": "^2.2.0",
    "auth0-lock": "^10.5.0",
    "core-js": "^2.4.1",
    "ng2-bootstrap": "^1.3.3",
    "ng2-charts": "^1.5.0",
    "ng2-toasty": "^2.5.0",
    "rxjs": "^5.2.0",
    "typescript": "^2.2.1",
    "zone.js": "^0.7.6"
  },
  "devDependencies": {
    "@angular/cli": "1.0.0-beta.32.3",
    "@angular/compiler-cli": "^2.4.0",
    "@types/jasmine": "2.5.38",
    "@types/node": "~6.0.60",
    "codelyzer": "~2.0.0-beta.4",
    "jasmine-core": "~2.5.2",
    "jasmine-spec-reporter": "~3.2.0",
    "karma": "~1.4.1",
    "karma-chrome-launcher": "~2.0.0",
    "karma-cli": "~1.0.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "karma-coverage-istanbul-reporter": "^0.2.0",
    "protractor": "~5.1.0",
    "ts-node": "~2.0.0",
    "tslint": "~4.4.2",
    "typescript": "~2.2.1"
  }

Answer 1

我在升级到 Angular 4.0 时遇到了您描述的一些错误：

Critical dependency: The request of the dependency is an expression.

将 angluar-cli 更新到最新版本为我解决了这个问题：

停止 ng serve（如果运行）。
npm install @angular/cli@latest --save-dev
ng serve

希望这也能解决您的 zone.js 问题（请随时通知我）。

警告：

The <template> element is deprecated. Use <ng-template> instead...

很可能是由使用已弃用的 template 语法的库（可能是 ng2-bootstrap、ng2-charts 或 ng2-toasty？）引起的（或者您在代码），因此您可能也想尝试升级它们——如果有更新的版本。我也收到了这个弃用警告，但是我有一个依赖项还没有更新到 4.0，所以我在接下来的几天里都在忍受它。

注意：我不是那些 upgrade instructions 的忠实粉丝，因为在某些项目上逐字跟随它们（就像我最初那样，没有注意）会让你dependencies 和 devDependencies 都引用同一库的不同版本。例如，您现在在您的 package.json 中引用了两个版本的 @angular/compiler-cli：4.0 和 2.4。

完整性更新

不幸的是，在 wuno 的情况下，要完成升级，他必须做到：

创建一个新项目。
更新一下。
将 src 目录替换为他现有项目中的目录。
npm install 并用他的额外包更新 package.json。

根据他的最后评论：

I had to create a new project, update it, replace the src directory with the one from my existing project then npm install and update package.json with my extra packages.

我们从来没有完全找出是什么导致了迫使他重新创建项目的问题，但是升级 CLI 最终解决了原始问题中的问题。

Angular 升级到 Angular 4 后路由不工作

Angular Routing Not Working After Upgrading to Angular 4

angular

platform-server