routeTree generation breaks when using different root in vite config

[ensconced]

Which project does this relate to?

Router

Describe the bug

In my vite config, I have root set to "./src". Initially this resulted in an error from the TanStackRouterVite plugin due to it trying to read the routes from ./src/src/routes, but I resolved this by adding routesDirectory: "./src/routes" and generatedRouteTree: "./src/routeTree.gen.ts" to the plugin config.

With this resulting setup, everything seems to work, except that when I create new route files they don't get filled with the usual boilerplate code. And for the routeTree.gen.ts to be updated I have to kill and restart the vite dev server.

Your Example Website or App

https://stackblitz.com/edit/tanstack-router-mzkds9em?file=vite.config.js,src%2Findex.html&preset=node

Steps to Reproduce the Bug or Issue

1. Go to the linked stackblitz
2. See that the app works fine
3. Try creating a new route file - it doesn't get automatically filled with the route boilerplate code
4. Manually add the code for the new route file - see that you get a TS error from createFileRoute (because the routeTree.gen.ts hasn't been properly updated) until you kill and restart the vite dev server

Expected behavior

• automatic filling of route files with boilerplate code should work regardless of root setting in vite config
• routeTree.gen.ts should get properly updated when adding/updating route files regardless of root setting in vite config

Screenshots or Videos

No response

Platform

• OS: macOS

Additional context

No response

[eliellis]

I'm having the same issue, for now I've worked around it (somewhat) with the following Vite config (using vite-plugin-restart):

import { defineConfig } from "vite";
import tailwindcss from "@tailwindcss/vite";
import react from "@vitejs/plugin-react";
import tsconfigPaths from "vite-tsconfig-paths";
import ViteRestart from "vite-plugin-restart";
import { TanStackRouterVite } from "@tanstack/router-plugin/vite";

export default defineConfig({
  root: "src/frontend",
  build: {
    outDir: "../../dist",
  },
  plugins: [
    // remove once https://github.com/TanStack/router/issues/3624 is fixed
    ViteRestart({
      restart: ["routes/**/*.ts(x)?"],
    }),
    tsconfigPaths(),
    TanStackRouterVite({
      target: "react",
      autoCodeSplitting: true,
      routesDirectory: "src/frontend/routes",
      generatedRouteTree: "src/frontend/routeTree.gen.ts",
    }),
    tailwindcss(),
    react(),
  ],
});

This restarts the vite process completely when any .ts(x)? file changes in the routes directory, which is definitely not ideal, but gets the job done until this gets sorted.