如何在webpack應用程序中包含主題2材料。 （JHipster）？

Question

我正在嘗試將角度材質模塊導入到我的應用中。 我做接下來的事情就： 安裝角材料

yarn add @angular/material 

包括nesesary模塊

@NgModule({ 
    imports: [ 
     DevizionSharedModule, 
     BrowserAnimationsModule, 
     MdCardModule, 
     MdTabsModule, 

包括在我vendor.scss @import德defoult風格「〜@角/材料/預建-themes /靛藍pink.css';

但它似乎沒有工作，我錯過了什麼？

在app.module.ts

Answer 1

1. 添加材料和hammerjs
   紗加@角/材料hammerjs（如果需要的紗線安裝） 材質應該是： 「@角/材料」：「^2.0.0-beta.2「版本

2. 在每個實體模塊中導入材料模塊和hammerjs
   」從@ angular/material'導入{MaterialModule}; 進口 'hammerjs';」 添加材料模塊進口陣列

3. 添加樣式vendor.scss添加它之前引導
   @import「node_modules/@角/材料/芯層/主題化/預建/ deeppurple-。 amber.scss';

Answer 2

進口角材料模塊，並將其添加在進口的元數據：

​​

然後將其添加到進口的元數據：

imports: [ 
    MaterialModule, 
    ..... 
    ] 

而且在添加此行您的全球scss文件：

@import '~@angular/material/core/theming/all-theme'; 
@include mat-core(); 

此外，您可能需要將此樣式表添加到index.html中E在您的應用材料圖標：

<link rel='stylesheet' href='https://fonts.googleapis.com/icon?family=Material+Icons'>