notFoundError warning triggers when rendering root route

[SzymonNadbrzezny]

Which project does this relate to?

Start

Describe the bug

Warning about notFoundError is shown when rendering root route and there's no defaultNotFoundComponent set, even though it renders successfully.

Error message: Warning: A notFoundError was encountered on the route with ID "__root__", but a notFoundComponent option was not configured, nor was a router level defaultNotFoundComponent configured. Consider configuring at least one of these to avoid TanStack Router's overly generic defaultNotFoundComponent (<div>Not Found<div>)

Your Example Website or App

Warning: A notFoundError was encountered on the route with ID "root", but a notFoundComponent option was not configured, nor was a router level defaultNotFoundComponent configured. Consider configuring at least one of these to avoid TanStack Router's overly generic defaultNotFoundComponent (

Not Found

)

Steps to Reproduce the Bug or Issue

1. Clone repo and run pnpm i
2. Run pnpm dev
3. Go to http://localhost:3000/
4. Warning should appear in the server logs

Expected behavior

Warning should not appear when there's no defaultNotFoundError set.

Screenshots or Videos

Platform

• OS: Windows 10
• Browser: Arc
• Version: Based on Chromium version 129.0.6668.71 (Official Build) (64-bit)

Additional context

Discord thread where @schiller-manuel helped me and told me to create new issue https://discord.com/channels/719702312431386674/1238170697650405547/1291393654765650033

[soyricardodev]

I had that error my first time using start, and I solved it by adding the notFound component, but nevertheless it has been marked as a bug since it does seem to be one. I would like to work on that as my first contribution.

[schiller-manuel]

@soyricardodev adding the notFoundComponent just silences this warning. however, there shouldn't even a not found error be thrown here.

[dotnize]

This is most likely caused by a missing favicon. Most modern browsers will automatically try to crawl /favicon.ico in the site, even if it's not defined in head. You can check the network tab to verify this.

If I add a favicon.ico to public/, the error goes away

[dlindahl]

I also ran into this problem while spinning up a brand new @tanstack/react-start app for the first time. I tried adding a favicon.ico but not only did that not fix anything, but the browser was not requesting the file in the first place.

Eventually I noticed some $undefined strings in the console from the "Injected From Server" logs. I closed the window and opened it again and noticed the notFoundError went away! Hooray!

And then I opened DevTools again and the warning came back.

Its almost like DevTools is requesting something from the server but there is nothing in the Network Tab that indicates a 4xx error and its unclear why any console statements would be making extra requests to the server.

I realize this is probably a react-start issue at this point, but sharing this here anyway in case someone else has the same problem.

Any thoughts on how to fix this?

EDIT:

I added a defaultNotFoundComponent and dumped the output of useMatches and this is what it contained:

{
  matches: [
    {
      id: '__root__',
      index: 0,
      routeId: '__root__',
      params: {},
      _strictParams: {},
      pathname: '/',
      updatedAt: 1749793758690,
      search: {},
      _strictSearch: {},
      searchError: undefined,
      status: 'success',
      isFetching: false,
      error: undefined,
      paramsError: undefined,
      __routeContext: {},
      __beforeLoadContext: {},
      context: {},
      abortController: AbortController {},
      fetchCount: 1,
      cause: 'enter',
      loaderDeps: '',
      invalid: false,
      preload: false,
      links: undefined,
      scripts: undefined,
      headScripts: undefined,
      meta: [Array],
      staticData: {},
      loadPromise: [Promise],
      fullPath: '/',
      globalNotFound: true,
      beforeLoadPromise: undefined,
      pendingTimeout: undefined,
      loaderPromise: undefined,
      headers: undefined
    }
  ]
}

Does this mean that root route itself is causing a 404 and only when DevTools are open? 🤔

For clarity, I only have one route (following the tutorial here)

[dotnize]

@dlindahl That must be the new /.well-known/appspecific/com.chrome.devtools.json file from a recent update in Chrome Devtools, which triggers a request to that file whenever you open devtools but it won't show up in the network tab.

See:

• https://stackoverflow.com/questions/79629915/well-known-appspecific-com-chrome-devtools-json-request
• https://www.reddit.com/r/node/comments/1kcr0wh/odd_request_coming_into_my_localhost_server_from/
• https://github.com/ChromeDevTools/vite-plugin-devtools-json

[JacobWeyer]

I just ran into the same situation; no error in my logs until I open the network tab. Is there something to do to stop vite from throwing the error?

[NextMerge]

That must be the new /.well-known/appspecific/com.chrome.devtools.json file from a recent update in Chrome Devtools, which triggers a request to that file whenever you open devtools but it won't show up in the network tab.

As far as I can tell, this is the root cause (assuming there are no other issues in the Network tab). You can verify it by seeing that the warning only appears when the dev tools are opened.

Adding the Vite plugin linked makes the warning disappear, but ultimately, the warning itself is harmless.