Angular Material - Can't resolve '@angular/material/theming'

user_4299913 0
Viewed 33679

I have followed the official guide and created a app-theme.scss with the following content:

@import '~@angular/material/theming';    
@include mat-core();    
$candy-app-primary: mat-palette($mat-indigo);
$candy-app-accent:  mat-palette($mat-pink, A200, A100, A400);    
$candy-app-warn:    mat-palette($mat-red);    
$candy-app-theme: mat-light-theme($candy-app-primary, $candy-app-accent, $candy-app-warn);    
@include angular-material-theme($candy-app-theme);

Content of styles.css:

@import './app-theme.scss';

However, I always get the following error during compilation: Module not found: Error: Can't resolve '@angular/material/theming'. What must I do to make it work?

angular-material2 angular sass
6 Answers

Angular 6+ --- Get all in one command

In Angular 6+, you simply need to install angular-material like

ng add @angular/material

What this command does? well see here

  1. Installs angular material, cdk, animations
  2. Adds references to the app.module.ts
  3. Adds material-icons' reference to the index.html
  4. It asks you to select the theme of your choice and adds reference to the angular.json (if theme does not work, import it in styles.css/styles.scss as described below)

but in previous versions, you were doing these steps manually

Angular 5

Using Angular5+, one or both import methods will work for you

@import "@angular/material/prebuilt-themes/indigo-pink.css";

@import "~@angular/material/prebuilt-themes/indigo-pink.css"; // in official docs
user_45742810

  1. Check this path ERROR in ./node_modules/@angular/material/prebuilt-themes/indigo-pink.css while you install any other module or library. In my case I installed Angular Syncfusion scheduler

  2. A new import statement gets added in the above path so what you have to do is just cut paste that import statement in style.css because it should it generally be there

  3. And while doing this process, the Angular material folder or Angular Syncfusion folder may also get deleted from node_modules, so make sure you type the command npm install so that npm can install all the dependencies mentioned in package.json

user_137134420
Related