Recently I updated my angular application to version 14 and after the upgrade, I am getting the below error. The error is below
./src/assets/vendor/default/styles.scss - Error: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Can't find stylesheet to import.
╷
4 │ @import "~src/vendor/libs/ng2-nouislider/mixins";
Could anyone help to resolve this problem?
Thanks in advance
For Angular 15. remove tilde symbol (~) from the path.
There are two options for resolve it:
node_modules instead of ~ tilda symbol as shown
@import node_modules/..../mixinsnode_modules to angular.json file as below"stylePreprocessorOptions": {
"includePaths": [
"src", "./node_modules"
]
}
I prefer to use the first one.
@angular/build_angular:browser-esbuild and @angular/build_angular:karmaI had the same problem with Angular 15 but the error only appeared in build and not locally.
~ (tilde) is no longer to be used since Angular 13 and is being deprecated.
I fixed the error replacing @import with @use in every file, as written here: sass at-rules import
In my case, after upgrading node and angular cli, my PATH variables were modified. I think that the ng build command was using a different version found in the path, instead of the local app version.
C:\Users[user]\AppData\Roaming\npm\node_modules@angular\cli\bin
I removed the above line, now the only one that remains in my user PATH is this:
C:\Users[user]\AppData\Roaming\npm
I have faced the same issue and couple of days I found below solution that works for me. add relative path @import '../../../node_modules/@angular/material/theming' ;
use the real path for it ex: @import '../../../node_modules/@angular/material/core/theming/all-theme';
