Extracting components from routes
Hi all, this feels like a noob question, but: what is the standard way in file-based routing to extract a component from my page to it's own file?
I can obviously create a shared
app/components/ directory for truly shared components (like Card, Button etc), but how about single use components that only exist on one page?
If I for example create routes/profile/AboutCard.tsx it seems to assume that this is a new route, but I just want it to be a component that my routes/profile/index.tsx can import.
Just wondering basically what the standard file structure for this is, and I've failed to find it by googling or asking the LLM's.
Thanks!7 Replies
stormy-gold•7mo ago
if it's truly a single use component, you could just let it in the route file
aside from that, checkout https://discord.com/channels/719702312431386674/1341509062201966695/1341509415848640512
modern-tealOP•7mo ago
Interesting, so maybe it’s not really possible. I wonder what people typically do. Maybe route files are nearly empty and they just mount of a component from a “pages” folder? Or route files become massive with lots of components in a single file
stormy-gold•7mo ago
what? did you read my link?
it certainly is possible
just use any of these 3 options
broad-brown•7mo ago
yeah, for example, without changing defaults you can just put a dash "-" in front of the component file name (that is,
-my-component.tsx) and it won't be picked up as a route.modern-tealOP•7mo ago
I guess I meant “not possible by default”. Having to configure include/excludes feels janky - so a better solution seems to be code based routing instead.
stormy-gold•7mo ago
well you can't have it all
how would router know which files are routes and which aren't?
modern-tealOP•7mo ago
I guess you’re right! It just feels like it would be a super common issue and I hadn’t seen any discussion or docs about it.
I’ll play around with it. Thanks for your help.