1

I have a question regarding if we need to compile our scss files to css and then import the css files in our react components or can we just import scss directly in the components?

I managed to import scss directly since we use react-scripts higher than version 2(which is the starting point having the sass-loader support) but are there some drawback to importing scss directly?

Currently our configuration is that we watch for scss changes and with node-sass-chokidar we compile it to css and import the css files, but I would like to change that so we don't have a bunch of css and scss files in the same folder level.

Thank you

luk492
  • 350
  • 3
  • 15
  • 2
    There are no drawbacks when importing SCSS. You can import the source files for the styles i.e. the SCSS files into the react components. That's what I would do anyway. This will also enable you to [share variables between the SCSS and your javascript](https://stackoverflow.com/questions/66119188/how-to-get-scss-variables-into-react/66120027#66120027) incase you need that – Martin Jun 10 '21 at 06:56
  • 1
    I just wanted to hear another persons opinion. Then I'll switch to importing scss directly, thus removing all of those generated css files which are just hardening readability. I suppose before react-scripts version 2 and the sass-loader, scss -> css was required, but I don't see added value doing that nowadays. Thanks – luk492 Jun 10 '21 at 09:52

1 Answers1

0

The answer was given by Martin in the post's comment

luk492
  • 350
  • 3
  • 15