Route “fragments”
I work in a monorepo that has lots of apps. Today, each app is responsible for managing its own routes (not using ts router today).
We have a top level platform package that imports components/ routes from each package and composes them together. I’m very close to accomplishing this with tanstack router, however the restriction that a root route must be defined is making this very difficult because composing N apps together means there will be N root routes.
I don’t know if this is possible or on the road map anywhere but it would be extremely nice to define a group of routes that are meant to be exported and consumed by a root route defined somewhere else. I can sort of accomplish this with virtual routes but there are other tradeoffs.
9 Replies
wise-white•10mo ago
the problem with this approach is that you cannot link from one package to another (at least not in a type safe way)
we want to investigate module federation however right now not a top priority
equal-aquaOP•10mo ago
That problem I’ve solved in our repo
wise-white•10mo ago
how?
equal-aquaOP•10mo ago
In our platform package, we have a specialized script that exports our route types. It works by running tsc—build where the router file is the main entry point
It only emits types, and it puts them into the root of our monorepo. Then, we have a d.ts file that pulls that artifact in and does the tanstack module definition dance
That file in turn is added to the includes list for packages that are relevant
So I do have routes being imported into the platform package and types are being reflected correctly. But- I’m doing things that I probably shouldn’t be to work around the double root problem
rare-sapphire•10mo ago
I'm also very investigating this, i've done it a couple times around with different versions of tsr - do you have an example repo you can share?
equal-aquaOP•10mo ago
@ShaneCodes which part you referring to? Exporting route types or merging route trees?
rare-sapphire•10mo ago
Merging route trees, its where I always get stuck
the root route catch 22, I was able to accomplish it in react router, tan stack just has so many more features now.
equal-aquaOP•10mo ago
I’ll see if i can get something in GitHub later this week
equal-aquaOP•10mo ago
GitHub
GitHub - davidturissini/tanstack-router-merge: Demo to show merging...
Demo to show merging Tanstack Router Routes. Contribute to davidturissini/tanstack-router-merge development by creating an account on GitHub.