如何在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'>