Route information is lost on vite HMR

[alsersan]

Hello! This might not be a problem at all, and it might just be me using the tools in ways they weren't meant to.

I've just recently migrated an app to tanstack router. I'm using file-based routing, but I'm importing all the components used for the routes (so for routeA a component is imported, instead of defining it in the same file).

To keep all the routes info (fullPath, useSearch, etc), I created an object that contains all the routes, where I imported all the different routes, to have them centralized. So therefore, in a Link component, instead of doing
<Link to='/routeA'>
I would do
<Link to={Routes.RouteA.fullPath}>
Or I could also do
Routes.RouteA.useSearch()
for example, without having to specify a "from" and without having to worry to re-write all the paths in case I change the name of a route (yes, I know that nowadays that's trivial with IDE's search and replace functionality, but anyway).

The issue arises when I trigger HMR on a specific route. If I'm in a route, and I modify any component inside that route, then the info from that route is lost (Route.RouteA no longer contains fullPath and other useful metadata). I created a quick demo here on stackblitz.

To reproduce: Go to any component, add a comment, and observe how the different routePaths switch to undefined depending on where the info is printed. Depending where you navigate from, you might have the fullPath defined, or not. What I don't get is why the only routes that stop working are those of the component that has been affected by HMR.

My question is, are the routes being regenerated even if nothing has changed in the routes naming/hierarchy? Is the Route object only meant to be used inside the route file itself? And finally, should I just use string paths everywhere and that's it?

Thanks!

[alsersan]

Mmmm having to use route strings everywhere might be a deal-breaker for me. I've just noticed that in navigation options, the paths are correctly inferred as the final path, but for useSearch and useParams, the paths are the literal paths to the route file.

For example, in my real app, I have a file route under this path /_app-layout/building-blocks_/$blockId, and that's what appears in the useSearch/useParams suggestions. However, for navigation (to in Links and from in useNavigate), the path is the real final path /building-blocks/$blockId, and that is what's suggested by the IDE (and the desired behaviour).

Having some hooks typed as the file path string and others as the literal final url path is quite inconvenient.