Hey, we build a management app with 100 - 200 routes. I don't want to define this all in one file.
Hey,
we currently build a big management frontend. We will probably have 100-200 routes. How can I best split this into different files (Don't one BIG file)?
For the Link-tag (<Link to={customerRoute.id}) we need "global" route exports, but how i can this manage with different files?
3 Replies
conscious-sapphire•3y ago
It looks like the multi-file code-split option was removed from the docs, but here is the example from the tanstack/router repo.
https://github.com/TanStack/router/tree/beta/examples/react/with-loaders-code-split
GitHub
router/examples/react/with-loaders-code-split at beta · TanStack/ro...
🤖 Fully typesafe Router for React (and friends) w/ built-in caching, 1st class search-param APIs, client-side cache integration and isomorphic rendering. - TanStack/router
conscious-sapphire•3y ago
You don't actually need to do the code-splitting part unless you want to, but this is a good template for you to define your routes in individual files, and then stitch them up into a single RouteTree.
If your question was about escaping having the single RouteTree file, I don't believe there is a solution for that, since the in-depth Typescript inferrence done by the package relies on being able to use the TS-declare to register it for the dev auto-complete and build time error detection.
conscious-sapphire•3y ago
I've also, got a repo I'm using the Router in for reference.
https://github.com/SeanCassiere/nv-rental-clone/tree/master/src/routes
GitHub
nv-rental-clone/src/routes at master · SeanCassiere/nv-rental-clone
Navotar with Tailwind and the Tanstack. Contribute to SeanCassiere/nv-rental-clone development by creating an account on GitHub.