compatible-crimson

NotFoundComponent defined at the route level not rendering.

Consider this folder structure.

__root.tsx -> notFoundComponent defined
settings/
  route.tsx -> notFoundComponent defined and <Outlet /> returned
  index.tsx -> component for /settings/

__root.tsx -> notFoundComponent defined
settings/
  route.tsx -> notFoundComponent defined and <Outlet /> returned
  index.tsx -> component for /settings/

There are no loaders defined. When I visit /settings/unknown the notFoundComponent defined in __root.tsx is shown, not the one under settings. What am I missing.

13 Replies

absent-sapphire•2mo ago

there is no lookup for a "closest" not found component happening. not sure if this is even possible to realize you could add a splat route under settings and throw a notFound there

compatible-crimsonOP•2mo ago

Hmm, because in the documention, https://tanstack.com/router/latest/docs/framework/react/guide/not-found-errors#configuring-a-routes-notfoundcomponent, it is stated that it can be done. So I was wondering, is there an error in my setup.

Not Found Errors | TanStack Router React Docs

⚠️ This page covers the newer notFound function and notFoundComponent API for handling not found errors. The NotFoundRoute route is deprecated and will be removed in a future release. See for more inf...

compatible-crimsonOP•2mo ago

Or I am misunderstanding the doc?

absent-sapphire•2mo ago

you are right did you set notfoundmode to fuzzy?

compatible-crimsonOP•2mo ago

yes

absent-sapphire•2mo ago

then please create a GitHub issue including a minimal complete reproducer

compatible-crimsonOP•2mo ago

I set notfoundmode in createRouter to fuzzy

absent-sapphire•2mo ago

either a bug or a misconfig, we will find out I think I found the bug

compatible-crimsonOP•2mo ago

Oh, really? I am still learning the router so unable to track the issue. Here is the reproducible stackbliz: https://stackblitz.com/edit/tanstack-router-gpzesz9s?file=src%2Froutes%2Fsettings%2Froute.tsx. I have notFoundPage at both root.tsx and settings/route.tsx. When navigating to /settings/unknown, in theory, it should route to notFoundPage defined at settings/route.tsx, but it is being routed to root.tsx.

Kaung Min Khant

StackBlitz

Router Quickstart File Based Example (duplicated) - StackBlitz

Run official live example code for Router Quickstart File Based, created by Tanstack on StackBlitz

absent-sapphire•2mo ago

this is a regression see this previous version https://stackblitz.com/edit/tanstack-router-ffgaz9uw?file=package.json can you please create a github issue for this so we can properly track it?

compatible-crimsonOP•2mo ago

Sure.

compatible-crimsonOP•2mo ago

created one: https://github.com/TanStack/router/issues/4712

GitHub

NotFound Component defined at the route level is not being rendered...

Which project does this relate to? Router Describe the bug The reproducible environment is given below. The bug: I defined a NotFoundComponent at route level, with notFoundComponent key in createFi...

absent-sapphire•2mo ago

thanks!

Gaming

Programming

NotFoundComponent defined at the route level not rendering.

Did you find this page helpful?