Angular routing does not work after upgrading to Angular 4

I updated it found here

On Linux / Mac: installing npm @ angular / {general, compiler, kli compiler, kernel, form, HTTP, platform browser, platform browser dynamic, platform server, router, animations} @latest typescript @latest --save

When I remove node_modules and then npm install , I get this,

WARNING. / ~ / @ Angular / core / @ angular / core.es5.js 5889: 15-36 Critical dependency: A dependency request is an expression

Maybe this will help someone help me. Does the problem seem to be related to ES5?

Current errors in the console.

enter image description here

Background

My project worked fine until I upgraded to Angular 4 last night. Now, when I click on the link and not load the module (I am lazy loading), it tells me that it cannot find the module.

Eror

ZoneAwareError {__zone_symbol__error: Error: Not shown (in promise): Error: Cannot find the module. /benefits/benefits.module '. Error: fails ......}

Has anyone else shared this situation or figured out how to fix it or even what needs to be done to solve the problem? I thought in Angular 4 ?

Code examples

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" } 
+5
source share
1 answer

I came across some errors that you indicated when upgrading to Angular 4.0:

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

Updating angluar-cli for the latter decided that for me:

  • Stop ng serve (if executed).
  • npm install @angular/ cli@latest --save-dev
  • ng serve

Hope this fixes your zone.js problem as well (keep me posted, please).

A warning:

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

most likely caused by a library (possibly ng2-bootstrap , ng2-charts or ng2-toasty ?) that uses the outdated template syntax (or you are in code), so you can try updating them if there is a newer version. I also received this fatigue warning, but I have a dependency that has not yet been updated to 4.0, so I live with it for the next few days.

Note I was not a big fan of these update instructions , following their verbatim (like I initially, ignoring) some projects gives you both dependencies and devDependencies link to different versions of the same lib. For example, now you have two versions of @angular/compiler-cli specified in your package.json : 4.0 and 2.4 .

Update for completeness

Unfortunately, in the case of wuno , in order to complete the update, it had to go as far as:

  • Create a new project.
  • Update it.
  • Replace the src directory with the one from his existing project.
  • npm install and upgrade package.json with your additional packages.

For the last comment:

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

We never found out what caused the problem that caused him to recreate the project in his particular case, but updating the CLI eventually fixed the problem in the original question.

+2
source

Source: https://habr.com/ru/post/1265967/


All Articles