More than 5 years have passed since last update.

angular4 + onsen ui + @angular/material

Posted at 2018-01-25

目的

angular5が出ているのに今更、 angular4 + onsen ui のアプリケーションに @angular/material を入れたい

ちょっとハマったこと

angular5が出ている状態だと @angular/material の最新版がインストールされて、 requires a peer of @angular/core@~5.1.0 but none is installed. You must install peer dependencies yourself. って言われる
angular5にあげると、 ngx-onsenui がアップデートするなと吠えてくる

解決

ngx-onsenui が吠えてこないangular4に対応している @angular/material をインストールする

結果

  "devDependencies": {
    "@angular/cdk": "^2.0.0-beta.12",
    "@angular/cli": "^1.5.3",
    "@angular/common": "^4.2.0",
    "@angular/compiler": "^4.2.0",
    "@angular/compiler-cli": "^4.2.0",
    "@angular/core": "^4.2.0",
    "@angular/flex-layout": "^2.0.0-beta.9",
    "@angular/forms": "^4.2.0",
    "@angular/http": "^4.2.0",
    "@angular/material": "^2.0.0-beta.12",
    "@angular/platform-browser": "^4.2.0",
    "@angular/platform-browser-dynamic": "^4.2.0",
    "@ngx-translate/core": "^8.0.0",
    "@ngx-translate/http-loader": "^2.0.0",
    "@types/core-js": "0.9.35",
    "angular2-highcharts": "0.5.5",
    "core-js": "^2.5.1",
    "lite-server": "^2.3.0",
    "ngx-onsenui": "^4.1.0",
    "node-sass": "^4.7.2",
    "onsenui": "~2.5.3",
    "rxjs": "5.0.3",
    "sass-loader": "^6.0.6",
    "tslint": "^5.7.0",
    "typescript": "2.3.4",
    "webpack": "^3.8.1",
    "zone.js": "^0.8.18"
  }

参考

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up