How do you structure your styling files on react? Do you use styled-components or do you use sass/scss?
For further actions, you may consider blocking this person and/or reporting abuse
How do you structure your styling files on react? Do you use styled-components or do you use sass/scss?
For further actions, you may consider blocking this person and/or reporting abuse
Colby Sanchez Wagenbach -
Amit K.। 🎧 -
AlexErdei73 -
Vlad -
Once suspended, raisaugat will not be able to comment or publish posts until their suspension is removed.
Once unsuspended, raisaugat will be able to comment and publish posts again.
Once unpublished, all posts by raisaugat will become hidden and only accessible to themselves.
If raisaugat is not suspended, they can still re-publish their posts from their dashboard.
Once unpublished, this post will become invisible to the public and only accessible to Saugat Rai.
They can still re-publish the post if they are not suspended.
Thanks for keeping DEV Community safe. Here is what you can do to flag raisaugat:
Unflagging raisaugat will restore default visibility to their posts.
Top comments (6)
Me and my team use css modules (without .module extension) and sass with scss notation. Each
.scss
file is in the same dir in whic.jsx
file is. We have structure likesrc/components/Avatar/Avatar.scss
and import it as module in.jsx
file.Also, there are some files in
src/styles
dir, that contain some global variables.I tried some ways of styling in JS apps and I found this way the simplest, cleanest and fastest 🏇
Cool. I think this approach is much cleaner than styled components. But have you tried styled components? And what are your thoughts on this?
Soon after your comment we decided to use styled-components in part of our system. It's been a while with them, so I've got some thoughts.
How did you configured it to not use the .module extension? Probably you did it inside webpack, but could you share the code?
We keep our components in folders, with their own Sass style file in there with them. And then additionally global Sass and variables files at the top level. I quite like this structure as it keeps component styles separate but doesn't pollute the JS with styling code.
I've noticed more people seem to be moving towards declaring their component styles in the JS though and would be keen to know why!
I also like the idea of placing the Sass file in the same component where it is use.
Using styled component is quite useful, but I think it makes the jS file very long.
Anyways, thanks for you opinion. :)