T
TanStack•4mo ago
foreign-sapphire

How do you handle two versions of an application?

I'm working on the UI of an opensource backup software using among other things tanstack router, react and vite. We want to create a commercial version of the UI which has 1/ the same routes with different contents and 2/ more routes, only available for the commercial release. For 1/, I can simply rely on a feature flag and on dead code elimination to have a different build between the commercial and the OSS versions. However, what's the best way for 2/? My first attempt is to put all my commercial views in a src/routes/_commercial, configure tanstack router with: 
      TanStackRouterVite({
        generatedRouteTree: isCommercial
          ? "./src/routeTree.commercial.gen.ts"
          : "./src/routeTree.gen.ts",
        routeFileIgnorePattern: isCommercial ? undefined : "_commercial",
      }),
      TanStackRouterVite({
        generatedRouteTree: isCommercial
          ? "./src/routeTree.commercial.gen.ts"
          : "./src/routeTree.gen.ts",
        routeFileIgnorePattern: isCommercial ? undefined : "_commercial",
      }),
and initialize the router with: 
const router = createRouter({
  routeTree: parseBoolString(import.meta.env.VITE_COMMERCIAL)
    ? routeTreeCommercial
    : routeTree,
   ...
})
const router = createRouter({
  routeTree: parseBoolString(import.meta.env.VITE_COMMERCIAL)
    ? routeTreeCommercial
    : routeTree,
   ...
})
Is it the way to go, or are there alternatives to consider?
3 Replies
ambitious-aqua
ambitious-aqua•4mo ago
maybe look into virtual file routes to include / exclude routes programatically
foreign-sapphire
foreign-sapphireOP•4mo ago
how would you exclude the route programmatically?
ambitious-aqua
ambitious-aqua•4mo ago
I assume you’d build two routers one behind the feature flag https://tanstack.com/router/latest/docs/framework/react/routing/virtual-file-routes
Virtual File Routes | TanStack Router React Docs
We'd like to thank the Remix team for . We've taken inspiration from their work and adapted it to work with TanStack Router's existing file-based route-tree generation. Virtual file routes are a power...

Did you find this page helpful?