Vite Plugin Route file generation does not work while Vite is running on Windows machines

[natejboucher]

Describe the bug

We just implemented router in our application and developers with Mac machines have the code generation feature working while Vite is running, it picks up new files and file changes, like the documentation says (docs)
However developers with Windows machines do not have that feature. The code generation only seems to check the folder when starting or restarting the application.

We use the default configuration for the plugin with the src/routes folder structure. Currently running router-vite-plugin: V1.19.0 and tanstack/react-router: V1.19.1. We tested the most recent release and the bug was still present, but decided to roll back due to known typescript issues.

This also does not work on the kitchen sink examples provided, however it is worth noting that it doesn't work there for Mac users either.

Your Example Website or App

https://tanstack.com/router/latest/docs/framework/react/examples/kitchen-sink-react-query-file-based

Steps to Reproduce the Bug or Issue

1. Have a Windows machine
2. Have Tanstack Router in your application with the router-vite-plugin added.
3. While the app is running, add a file to the routes folder
4. The code generation feature should not have picked up the change and the file should remain empty, along with no changes to the routeTree
5. Stop the application and then start it
6. The code generation should pickup the new file, generate the code and update the routeTree

Expected behavior

The code generation feature should see the new file or file change while Vite is running and run the code generation feature.

Screenshots or Videos

No response

Platform

• OS: Windows
• Browser: Chrome
• Version: React Router: 1.19.1 Router Vite Plugin: 1.19.0

Additional context

No response

[nilshartmann]

I have the same problem on MacOS. It also appears if a route file is renamed, in the renamed file the path to createFileRoute is not updated (and not "Regenerating routes..." message on console).

I tried several ways and that's what i found (MacOS, Router Vite Plugin 1.19.6). In general it seems, the generator does not run on created or removed but only on modified files:

Inside your route folder:

• touch a new file (in my test it's zsh): touch hello.tsx -> generator does not run
• touch the same file again: touch hello.tsx -> generator does run

That also seems to work for files that have been added in between

• touch a.tsx   # NOT run
  touch b.tsx  # NOT run
  touch c.tsx  # NOT run
  
  # touch one of the new routes again
  touch a.tsx # Routes for a, b AND c _are_ all generated at once

Removing files: given a.tsx and b.tsx are existing route files, for that the generator already had been run before:

• rm a.tsx   # NOT run
  touch b.tsx  # run, updates routeTree.gen.ts and removes /a

Hope that helps. Please let me know if there is anything I can do to help you.

[SeanCassiere]

I made some changes to the hook that our vite plugin was using to watch for changes. It went out with release 1.24.1.

@natejboucher - could you check if this has made any impact to the experience on Windows?
@nilshartmann - could you also confirm this against your scenarios that you listed?

[nilshartmann]

@SeanCassiere thanks a ton, it's working now 🎉

Happy routing! 🐣

[SeanCassiere]

@natejboucher when you have chance, could you confirm if this change made any impact to the Windows experience?

You can download the Router Stackblitz Starter and quickly test it with the latest version of TanStack Router with the Vite Plugin.

[SeanCassiere]

Closing for now.

@natejboucher if this fix that went out with the release from this comment didn't fix the problem on Windows, please let us know.

[usmanabdurrehman]

@SeanCassiere This problem still exists on windows. I am using @tanstack/router-vite-plugin ^1.28.2 which is the latest version rn. Routes only get updated in routeTree.gen.ts when we restart the server. Link for example project if you want to test on a windows VM https://github.com/usmanabdurrehman/tanstack-router-tutorials

[visualjerk]

@usmanabdurrehman I experienced the same issue on MacOS. Upgrading vite and @vitejs/plugin-react to the latest version fixed the issue for me.

[usmanabdurrehman]

@visualjerk 😭 man. Thank you so much. I thought when making apps with vite it would automatically install the latest vite versions but it was way behind. Thanks for the help 👍