React CSS file structure?
I've just started this project using Vite, and I always get a little confused on where to contain my CSS.
index.css I've always used as the global css styling, and I delete app.css... do you do something different?
18 Replies
You use Tailwind duh
😅🥲
...
But no really React does not provide a good solution, the expect you to bring your own for the most part.
From what I've seen you do want to name your component.css in the same folder as the component.
So leaving it app.css would follow that convention
Yeah that's fine, I do wonder why I'd style it though, since it's kinda just the uhh... import page lol
"import and prop everything into here to make page go yay!"
Good place for display: contents; to ignore the app div
But I'd probably just inline it. I also think that's the global scope so ... Global stuff
It's like you've chosen to confuse me on purpose, so I'll hate React even more, b1..
😄
You want to have Vite import the global too not put index.css in head of index.html
Ngl no one names a global index either
Index is a standard for the default file in a folder
so delete index.css, and use app.css as the global file
If you have ever made a normal website you would understand pewpewpew
You've been helpful good sir
I'd double check the docs but yes specially if main.jsx or what ever imports it.
Cause you want that for vite to set cache headers typically
Gotcha
Like b1 said React doesn't have a strong opinion. I believe it does say to try to keep nesting at a minimum, but I thought it made a lot of sense to do it how I did it here https://github.com/v11ncent/Listen-Party-Revamped/tree/master/frontend/src/components
GitHub
Listen-Party-Revamped/frontend/src/components at master · v11ncent/...
Revamped version of Listen Party using Vite, React, TypeScript, & Sass - v11ncent/Listen-Party-Revamped
Warning that inside Lobbies/ there's some nesting but it's for a specific component so I thought it made logical sense
ah yea you used modules too that is what I was trying to link him
but he thought I was just teasing him I think.
I trust vince, he never lets me down
Yea Vince is pretty ontop of things specially for a rather new dev 👍 safe bet.
I watched your vid though, I understand 😛