CODEWITHSUNDEEP
angulardependenciesangular-material
Nitin
Nitin

Reputation: 79

Angular 4 compatibility with @angular/material

I am trying to npm install --save @angular/material @angular/cdk and my package.json looks like this:

"dependencies": {
"@angular/common": "^4.4.7",
"@angular/compiler": "^4.4.7",
"@angular/core": "^4.4.7",
"@angular/forms": "^4.4.7",
"@angular/http": "^4.4.7",
"@angular/platform-browser": "^4.0.0",
"@angular/platform-browser-dynamic": "^4.0.0",
"@angular/router": "^4.4.7",
"angular2-jwt": "^0.2.3",
"bootstrap": "^4.1.0",
"core-js": "^2.4.1",
"jquery": "^3.3.1",
"popper.js": "^1.14.3",
"rxjs": "^5.1.0",
"save": "^2.3.2",
"zone.js": "^0.8.4"
}
"devDependencies": {
        "@angular/cli": "^1.0.0",
        "@angular/compiler-cli": "^4.0.0",
        "@types/jasmine": "2.5.38",
        "@types/node": "^6.0.111",
        "codelyzer": "~2.0.0",
        "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-coverage-istanbul-reporter": "^0.2.0",
        "karma-jasmine": "^1.1.2",
        "karma-jasmine-html-reporter": "^0.2.2",
        "protractor": "~5.1.0",
        "ts-node": "~2.0.0",
        "tslint": "~4.5.0",
        "typescript": "2.4.2"
      }

I get unmet dependencies warning:

npm WARN @angular/[email protected] requires a peer of @angular/core@>=6.0.0-beta.0 <7.0.0 but none is installed. You must install peer dependencies yourself.

npm WARN @angular/[email protected] requires a peer of @angular/common@>=6.0.0-beta.0 <7.0.0 but none is installed. You must install peer dependencies yourself.

npm WARN @angular/[email protected] requires a peer of @angular/core@>=6.0.0-beta.0 <7.0.0 but none is installed. You must install peer dependencies yourself.

npm WARN @angular/[email protected] requires a peer of @angular/common@>=6.0.0-beta.0 <7.0.0 but none is installed. You must install peer dependencies yourself.

When I manually change these versions along with all "@angular/*", "rxjs", @angular/compiler-cli" to "^6.0.0" in package.json and run npm install I get this error:

npm WARN [email protected] requires a peer of @angular/core@^2.0.0||^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/http@^2.0.0||^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of rxjs@^5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/compiler@^2.3.1 || >=4.0.0-beta <5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/core@^2.3.1 || >=4.0.0-beta <5.0.0 but none is installed. You must install peer dependencies yourself.

Error message is suggesting to downgrade core, http and rxjs versions. If I do that I get the material and cdk error so I am stuck in this circle..

Any help is much appreciated..

Upvotes: 1

Views: 2666

Answers (1)

Ploppy
Ploppy

Reputation: 15363

You are installing the latest version of @angular/cdk and @angular/material (version 6.x.x), the major versions of those packages should match the major version of other @angular packages in your dependencies. That's why you get warnings because your run the 4.x.x version of Angular.

From experience I can tell that angular2-jwt warning is not a problem. Though it is recommended to switch to the new version of the package available at @auth0/angular-jwt (https://github.com/auth0/angular2-jwt)

Basically, what I recommend you right now is to update everything to version 5.0.0

Start by updating angular-cli to its latest version (https://github.com/angular/angular-cli#updating-angular-cli)

Then update Angular by following there official guide (https://update.angular.io/)

Upvotes: 2

Related Questions