In previous versions of Stackblitz there used to be a styles.css
file and to use one of the prebuilt themes we could just add an import to styles.css
like this.
@import "~@angular/material/prebuilt-themes/indigo-pink.css";
However with the latest Stackblitz which uses global_styles.css
this errors.
https://stackblitz.com/edit/stackblitz-starters-od474b?file=src%2Fmain.ts,src%2Fglobal_styles.css
How do we import themes in Stackblitz with Angular 17?
v17 uses the application builder when creating a project from scratch.
This builder relies on Esbuild which doesn't support "~" in path (it's a webpack feature).
Remove the ~
and you're good.
@import '@angular/material/prebuilt-themes/indigo-pink.css';
Also you're missing the MatButtonModule
in your example and dont forget to import the icons font.