6

I'm trying to update from Angular 2.3 to Angular 4.0 and following the instructions here:

http://webcache.googleusercontent.com/search?q=cache:Xd-ocIKZ0BkJ:angularjs.blogspot.com/2017/03/angular-400-now-available.html+&cd=1&hl=en&ct=clnk&gl=us

In that article, it says that pretty much all I need to do is type this command:

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

When I do that, I get these errors:

+-- UNMET PEER DEPENDENCY @angular/core@4.0.2
+-- UNMET PEER DEPENDENCY @angular/http@4.0.2

I tried doing "npm install" for each of these independently of one another as described here: How to solve npm UNMET PEER DEPENDENCY, but it didn't do any good. I kept getting the same errors.

Any suggestions? I'm on Windows running Node 4.5.0 and npm 3.10.6.

Here is my package.json:

{
  "name": "Project",
  "version": "1.0.1",
  "scripts": {
    "start": "tsc && concurrently \"tsc -w\" \"lite-server\" \"npm run generate-css\" \"npm run watch-css\" ",
    "pree2e": "npm run webdriver:update",
    "e2e": "tsc && concurrently \"http-server -s\" \"protractor protractor.config.js\" --kill-others --success first",
    "lint": "tslint ./app/**/*.ts -t verbose",
    "generate-css": "node-sass -r app --output ./generated-css",
    "watch-css": "node-sass -w -r app --output ./generated-css",
    "lite": "lite-server",
    "test": "tsc && concurrently \"tsc -w\" \"karma start karma.conf.js\"",
    "test-once": "tsc && karma start karma.conf.js --single-run",
    "tsc": "tsc",
    "tsc:w": "tsc -w"
  },
  "license": "",
  "author": "Me",
  "dependencies": {
    "@angular/animations": "4.0.2",
    "@angular/common": "4.0.2",
    "@angular/compiler": "4.0.2",
    "@angular/compiler-cli": "4.0.2",
    "@angular/core": "4.0.2",
    "@angular/forms": "4.0.2",
    "@angular/http": "4.0.2",
    "@angular/platform-browser": "4.0.2",
    "@angular/platform-browser-dynamic": "4.0.2",
    "@angular/platform-server": "4.0.2",
    "@angular/router": "4.0.2",
    "angular-in-memory-web-api": "0.2.4",
    "angular2-ui-switch": "1.2.0",
    "bootstrap": "3.3.7",
    "core-js": "^2.4.1",
    "mydatepicker":"1.2.9",
    "ng2-translate": "5.0.0",
    "reflect-metadata": "0.1.9",
    "rxjs": "5.0.1",
    "socket.io": "1.7.2",
    "lodash": "4.17.4",
    "socket.io-client": "1.7.2",
    "systemjs": "0.19.40",
    "wijmo": "wijmo-system-min",
    "zone.js": "0.8.5",
    "typescript": "2.2.2"
  },
  "devDependencies": {
    "@types/core-js": "0.9.35",
    "@types/jasmine": "2.5.40",
    "@types/node": "6.0.58",
    "@types/selenium-webdriver": "2.53.39",
    "@types/lodash": "4.14.62",
    "canonical-path":"0.0.2",
    "codelyzer": "0.0.25",
    "concurrently": "3.1.0",
    "http-server": "0.9.0",
    "jasmine-core": "2.5.2",
    "karma": "1.3.0",
    "karma-chrome-launcher": "2.0.0",
    "karma-cli": "1.0.1",
    "karma-htmlfile-reporter": "0.3.4",
    "karma-jasmine": "1.1.0",
    "karma-jasmine-html-reporter": "0.2.2",
    "lite-server": "2.2.2",
    "live-server": "1.1.0",
    "lodash": "4.17.4",
    "node-sass": "3.13.1",
    "nodemon": "1.11.0",
    "protractor": "3.3.0",
    "rimraf": "2.5.4",
    "tslint": "3.15.1"
  }
}
Community
  • 1
  • 1
David
  • 1,620
  • 3
  • 20
  • 39

1 Answers1

1

It seems that conflict between vresions of node_modules mentioned in package.json

Use the below

"dependencies": {
    "@angular/animations": "^4.0.1",
    "@angular/common": "^4.0.1",
    "@angular/compiler": "^4.0.1",
    "@angular/compiler-cli": "^4.0.1",
    "@angular/core": "^4.0.1",
    "@angular/forms": "^4.0.1",
    "@angular/http": "^4.0.1",
    "@angular/material": "^2.0.0",
    "@angular/platform-browser": "^4.0.1",
    "@angular/platform-browser-dynamic": "^4.0.1",
    "@angular/platform-server": "^4.0.1",
    "@angular/router": "^4.0.1",
     "bootstrap": "^3.3.6",
    "core-js": "^2.4.1",
    "font-awesome": "^4.7.0",
    "rxjs": "5.0.1",
    "systemjs": "0.19.40",
    "typescript": "^2.2.2",
    "zone.js": "^0.8.5"
  },

Updated : Angular material

"@angular/material": "^2.0.0-beta.3",
Aravind
  • 40,391
  • 16
  • 91
  • 110
  • I think I spoke too soon.. it looks like I still have unmet peer dependencies. I didn't see them before because my terminal buffer wasn't big enough to show the full results of the install. On a clean install (after deleting node_modules folder) I still get "unmet peer dependency" for @angular/core@4.0.2 and @angular/http@4.0.2 – David Apr 13 '17 at 15:47
  • On which one you are seeing dependency?? Better to use this [**answer**](http://stackoverflow.com/questions/42603387/error-with-jasmine-node-module-in-angular-2/42604431#42604431) and update your package json completely – Aravind Apr 13 '17 at 15:53
  • I followed the instructions there, and after updating, ncu says "all dependencies match the latest package versions" with a smiley face. But npm install still shows those same two "unmet peer dependencies" in red. And the app is completely broken. I'm reverting my package.json back to the version above. – David Apr 13 '17 at 17:24