How to Simplify SCSS File Imports in Angular
Hey, we all have ever seen something like this in our SCSS files:
@import '../../../../../my-css-file';
But that’s not really sexy, right? Thanks to the power of the pre-processor, we can now just code:
@import 'my-css-file';
How? We need to update our angular.json like this:
{ ... "projects": { "<project_name>": { ... "architect": { "build": { "builder": "@angular-devkit/build-angular:browser", "options": { ... "stylePreprocessorOptions": { "includePaths": [<path_to_my_scss_folder>] } ... } } ... } } } ...}
Thanks for reading.
Learn More
Top comments(1)
Subscribe

Dios Vo•• Edited on• Edited
The best never rest
- LocationViet Name
- EducationHCMC Open University '21
- WorkFront End Dev
- Joined
If your Angular version is greater than 12, you can use @use instead.
For further actions, you may consider blocking this person and/orreporting abuse