Auto-import all *.scss in ReactJS project

user_9701988 0
Viewed 2140

Is there any way to import all _*.scss files to main App.scss file in React project? As I have separate folder for each component, I want to avoid typing 

@import './components/UI/button';
@import './components/UI/menu';
@import './components/Forms/textInput';

What would be perfect is a working code like this:

@import './components/*';

I'm aware of order problem, I doesn't affect my css, files can be imported randomly.

reactjs sass
2 Answers

The glob package will do it if you really wanted. I would advise against it though, including a sass file directly in the component is more efficient but mostly because order matters in CSS.

user_104741290

You can create file _index.scss in components directory and import all files from the subdirectories. After you can import writing @import './components/index'; or @import './components';

user_33260080
Related