Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Can't find stylesheet to import: @use '~@angular/material' as mat;

See original GitHub issue

Using the latest Angular Material version (13.0.0) the first line of my theme.scss throws an error:

SassError: Can't find stylesheet to import.
  ╷
2 │ @use '~@angular/material' as mat;

I’ve checked the next-versions: it was working with 13.0.0-next.7 and stopped working from 13.0.0-next.8 on.

Issue Analytics

State:
Created 2 years ago
Comments:23 (8 by maintainers)

Top GitHub Comments

9reactions

qliqdevcommented, Nov 20, 2021

Without tilda sign works but stylint error occuring.

Angular CLI: 13.0.3
Node: 16.13.0
Package Manager: npm 8.1.4
OS: darwin x64

Angular: 13.0.2
... animations, cdk, common, compiler, compiler-cli, core, forms
... language-service, localize, material
... material-moment-adapter, platform-browser
... platform-browser-dynamic, router, service-worker

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1300.3 (cli-only)
@angular-devkit/build-angular   13.0.3
@angular-devkit/core            13.0.3 (cli-only)
@angular-devkit/schematics      13.0.3 (cli-only)
@angular/cli                    13.0.3
@angular/flex-layout            12.0.0-beta.35
@schematics/angular             13.0.3 (cli-only)
rxjs                            7.4.0
typescript                      4.4.4

6reactions

ecruz165commented, Nov 28, 2021

I no longer saw this issue once i added the following to angular.json

"stylePreprocessorOptions": {
  "includePaths": [
    "node_modules",
    "src/assets/styles"
  ]

Top Results From Across the Web

Can't find stylesheet to import. @use '~@angular/material' as ...

For Angular 13 try to remove tilde symbol ( ~ ) from the path so import like: @use '@angular/material' as mat;. It works...

scss unable to find stylesheet. - Angular - EJ 2 - Syncfusion

When I tried creating a dropdownlist with scss I get an error that it can't find the stylesheet. The error occurs when it...

Getting error "Can't find stylesheet to import" "@import 'style.scss'

The 'style. scss' is located within my assets folder and then I am trying to import it within my app/angular folder.

Angular Material Theming System - Complete Guide

Angular Material v12 included a migration from @import usage to @use for all ... &.mat-primary { #{$property}: theming.get-color-from-palette($primary, ...

Theming your own components - Angular Material

@use 'sass:map'; @use '@angular/material' as mat; $color-config: mat.get-color-config($theme); $primary-palette: map.get($color-config, ...