T
TanStack•3mo ago
xenial-black

Possible to use multiple routeTree.gen.ts files?

Hello, Has anyone used mutliple client side routers in one vite project before? Maybe im approaching this the wrong way, but I have a MPA that I would love to be able to have each page in my MPA have its own SPA client side router. I set up my vite config like this: 
  plugins: [
    TanStackRouterVite({
      target: "react",
      autoCodeSplitting: false,
      routesDirectory: "./src/routes/app-one",
      generatedRouteTree: "./src/routeTrees/app-one/routeTree.gen.ts",
    }),
    TanStackRouterVite({
      target: "react",
      autoCodeSplitting: false,
      routesDirectory: "./src/routes/app-two",
      generatedRouteTree: "./src/routeTrees/app-two/routeTree.gen.ts",
    }),
    react(),
    ...
  plugins: [
    TanStackRouterVite({
      target: "react",
      autoCodeSplitting: false,
      routesDirectory: "./src/routes/app-one",
      generatedRouteTree: "./src/routeTrees/app-one/routeTree.gen.ts",
    }),
    TanStackRouterVite({
      target: "react",
      autoCodeSplitting: false,
      routesDirectory: "./src/routes/app-two",
      generatedRouteTree: "./src/routeTrees/app-two/routeTree.gen.ts",
    }),
    react(),
    ...
And I generate two routeTree.gen.ts files. But the TS Server seems to pick up only router types for app-two. Would be really cool to have one src directory for many MPA's while also having each page isolated with its own Tanstack router. I could disable types on the routers, which would solve my issue, but then I wouldn't get types. Cheers
1 Reply
rare-sapphire
rare-sapphire•3mo ago
the issue with this approach is that you can only have one registered router per tsconfig did you separate them? probably best if you provide a complete minimal example repo

Did you find this page helpful?