passive-yellow

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

extended-salmon•6d ago

maybe look into virtual file routes to include / exclude routes programatically

passive-yellowOP•6d ago

how would you exclude the route programmatically?

fair-rose•6d 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...

Gaming

Programming

How do you handle two versions of an application?

Did you find this page helpful?