Error "Invariant failed: Could not find match for from" when layout + file-based routing is used

[Dharmang92]

Which project does this relate to?

Router

Describe the bug

When trying to use the layout routing file, the routes created are correct but when trying to open one of the route using component, it fails to load or when trying to refresh the page which is already on the failed route.

Your Example Website or App

https://stackblitz.com/edit/tanstack-invariant-bug

Steps to Reproduce the Bug or Issue

1. Click on About or Dashboard link
2. Error is thrown

Expected behavior

I should be able to properly add a layout routing file and the nested components should work correctly.

For example below routes:

app/home
app/about
app/dashboard

I have route.tsx (default pattern for layout file) file inside app folder which contains the nav bar, then /home, /about and /dashboard should have the nav bar present in them.

Screenshots or Videos

Platform

"@tanstack/react-router": "^1.116.0"
"@tanstack/router-plugin": "^1.116.1"

Additional context

No response

[schiller-manuel]

your example has a basepath 'app' configured AND your routes are inside an app folder.
So the runtime URL would be /app/app/..
Probably not what you want?
Either remove the basepath or move the routes outside of the app folder

[Dharmang92]

Is there any specific change in the latest version cause the same code works for v1.102.5?
If I remove the basepath, is there any way to directly redirect to /app always?

[schiller-manuel]

throwing a redirect to /app in __root's beforeLoad could work

[Dharmang92]

Thank you for the quick response @schiller-manuel, I tested this out but even when I add beforeLoad and removing the app folder, it still doesn't redirect to app just like how basepath would work. Also renaming the app folder to app_ doesn't work...

[Dharmang92]

+

I just want a way to do below, it's not very complex as far as the configuration goes...

1. I should be able to have an app directory (just to keep the structure of the routes in sync with the folder structure)
2. Start the application with default /app route - basically if someone lands on the root page for e.g. example.com/ then it should route to example.com/app
3. Layouting for a group of routes nested inside a folder for e.g. let's say I have a folder called auth and there's specific layout I want to use then I should be able to create route.tsx file and it should work as expected (this already exists but as you know the bug mentioned here remains and the layout doesn't work if we remove the app folder as now the layout file exists with the __root.tsx file).

throwing a redirect to /app in __root's beforeLoad could work

PS: This hungs up the page forever... I am just not able to debug the page to find the issue.