After upgrading an Angular 12 project to Angular 13 I encountered an issue where SCSS was no longer to locate a shared style sheet in a library. It appears that that Tilde (~) no longer resolves to node_modules.
Broken:
@use '~my-angular-lib' as lib;
Works:
@use '../node_modules/my-angular-lib' as lib;
I noticed that angular material just directly refences '@angular/material' as of Angular 13 but I can't figure out how to get that to work with my library. It seems kind of hacky to use a relative path to node_modules every time.
What is the current best method of refencing a style sheet in node_modules, or what am I missing to where ~ no longer points to node_modules?
Angular has been deprecating the use of ~ for Sass @use and @import statements for a while.
Officially, as of Angular version 13 the usage of tilde imports won't be supported anymore.
Here about the why this is working without tilde