loading...

re: How do you organize your CSS? VIEW POST

FULL DISCUSSION
 

I have my SCSS files organised by components. E.g.I have component for page header and I have alongside SCSS file with styles for that. The styles are link to the component file and extracted and merged during build.

Then I have file with root styles (to reset html/body etc) and file with variables (mainly colours).

As such I keep every file as simple as possible (have lint rule to allow max 3 rule nesting and many other rules for company coding standards).

Generally, when the SCSS file is too big, is too big the component itself -> time for refactoring and breaking to multiple smaller components.

And in webpack, we have it set during development for hot reload, so I can change any SCSS file and it is immediately updated in the browser. With the right naming of the file too, so I know, where the css rule origins.

 

Generally, when the SCSS file is too big, is too big the component itself -> time for refactoring and breaking to multiple smaller components.

Agreed.

code of conduct - report abuse