css Question posted in
Some basic documentation can be found here.

Css – Angular 17 – Can't find stylesheet to import (After Angular Upgrade)

I have found everything related to angular material theming, however, it’s not the case.

After Angular 16 upgrade to Angular 17 I cannot import some styles from a specific node_module.

HookWebpackError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js): Can't find stylesheet to import.

Everything was working fine before the upgrade

Example import: @import '@package/src/components/specific-component';

If the scss file in node_module that I’m trying to import doesn’t have any imports inside of it, everything works without any errors, however, if it has – I get provided error.

specific-component.scss (from node_module) – that would give an error, if I tried importing it in my own scss

@import 'mixins';

.specific-class {
  @include something();
}

specific-component.scss – that works and imports normally as before.

//@import 'mixins';

.specific-class {
  color: white;
}

Anyone encountered something similar and resolved that?

Tags:

2

Answers


  1. 0

    Make sure you have added the paths of the scss files you want to use in the stylePreprocessorOptions, includePaths inside angular.json.

    "stylePreprocessorOptions": {
   "includePaths": [
     "src/styles",
     "src/assests/styles"
  ]
}

    Then try importing them like.

    @import 'mixins.scss';

.specific-class {
  @include something();
}
    Login or Signup to reply.
  2. 0

    Please try below configuration in your angular.json file (path: projects..architect.build.options.stylePreprocessorOptions)

    Configuration:

    "stylePreprocessorOptions": {
    "includePaths": [
    "."
    ]
    }

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search