Track generated route tree in scaffolds

.changeset/track-route-tree.md

@@ -0,0 +1,5 @@
+---
+"@tanstack/create": patch
+---
+
+Keep the generated route tree tracked in new React and Solid apps and run route generation once during scaffold.

packages/create/src/create-app.ts

@@ -31,7 +31,7 @@ function stripExamplesFromOptions(options: Options): Options {
           !isDemoFilePath(route.path) &&
           !(route.url && route.url.startsWith('/demo')),
       )
-      
+
       const filteredIntegrations = (addOn.integrations || []).filter(
         (integration) => !isDemoFilePath(integration.path)
       )
@@ -277,6 +277,37 @@ async function runCommandsAndInstallDependencies(
   await installShadcnComponents(environment, options.targetDir, options)
 
   await setupIntent(environment, options.targetDir, options)
+
+  if (shouldGenerateRoutes(options)) {
+    s.start(`Generating route tree...`)
+    const command = getPackageManagerScriptCommand(options.packageManager, [
+      'generate-routes',
+    ])
+    const cmd = formatCommand(command)
+    environment.startStep({
+      id: 'generate-routes',
+      type: 'command',
+      message: cmd,
+    })
+    await environment.execute(
+      command.command,
+      command.args,
+      options.targetDir,
+      {
+        inherit: true,
+      },
+    )
+    environment.finishStep('generate-routes', 'Route tree generated')
+    s.stop(`Route tree generated`)
+  }
+}
+
+function shouldGenerateRoutes(options: Options) {
+  return (
+    options.install !== false &&
+    options.mode === 'file-router' &&
+    (options.framework.id === 'react' || options.framework.id === 'solid')
+  )
 }
 
 async function seedEnvValues(environment: Environment, options: Options) {

packages/create/src/frameworks/react/project/base/_dot_gitignore

@@ -6,7 +6,6 @@ dist-ssr
 .env
 .nitro
 .tanstack
-src/routeTree.gen.ts
 .wrangler
 .output
 .vinxi

packages/create/src/frameworks/react/project/base/package.json

@@ -7,6 +7,7 @@
   },
   "scripts": {
     "dev": "vite dev --port 3000",
+    "generate-routes": "tsr generate",
     "build": "vite build",
     "preview": "vite preview",
     "test": "vitest run"

packages/create/src/frameworks/react/project/base/tsr.config.json

@@ -0,0 +1,3 @@
+{
+  "target": "react"
+}

packages/create/src/frameworks/react/project/packages.json

@@ -15,6 +15,9 @@
     }
   },
   "file-router": {
+    "devDependencies": {
+      "@tanstack/router-cli": "^1.132.0"
+    },
     "dependencies": {
       "@tanstack/router-plugin": "^1.132.0"
     }

packages/create/src/frameworks/solid/project/base/_dot_gitignore

@@ -6,7 +6,6 @@ dist-ssr
 .env
 .nitro
 .tanstack
-src/routeTree.gen.ts
 .wrangler
 .output
 .vinxi

packages/create/src/frameworks/solid/project/base/package.json

@@ -4,6 +4,7 @@
   "type": "module",
   "scripts": {
     "dev": "vite dev --port 3000",
+    "generate-routes": "tsr generate",
     "build": "vite build",
     "start": "node .output/server/index.mjs",
     "preview": "vite preview",

packages/create/src/frameworks/solid/project/base/tsr.config.json

@@ -0,0 +1,3 @@
+{
+  "target": "solid"
+}

packages/create/src/frameworks/solid/project/packages.json

@@ -11,6 +11,9 @@
     }
   },
   "file-router": {
+    "devDependencies": {
+      "@tanstack/router-cli": "^1.133.21"
+    },
     "dependencies": {
       "@tanstack/router-plugin": "^1.133.21"
     }

packages/create/tests/create-app.test.ts

@@ -4,8 +4,7 @@ import { resolve } from 'node:path'
 import { createApp } from '../src/create-app.js'
 
 import { createMemoryEnvironment } from '../src/environment.js'
-import { FILE_ROUTER } from '../src/constants.js'
-import { AddOn, Options } from '../src/types.js'
+import type { AddOn, Options } from '../src/types.js'
 
 const simpleOptions = {
   projectName: 'test',
@@ -43,7 +42,7 @@ const simpleOptions = {
   packageManager: 'pnpm',
   typescript: true,
   tailwind: true,
-  mode: FILE_ROUTER,
+  mode: 'file-router',
   variableValues: {},
 } as unknown as Options
 
@@ -88,6 +87,43 @@ describe('createApp', () => {
     expect(output.commands.some(({ command }) => command === 'echo')).toBe(true)
   })
 
+  it.each(['react', 'solid'])(
+    'generates routes for %s file-router apps after install',
+    async (frameworkId) => {
+      const { environment, output } = createMemoryEnvironment()
+      await createApp(environment, {
+        ...simpleOptions,
+        framework: {
+          ...simpleOptions.framework,
+          id: frameworkId,
+        },
+        install: true,
+      } as Options)
+
+      expect(output.commands).toContainEqual({
+        command: 'pnpm',
+        args: ['generate-routes'],
+      })
+    },
+  )
+
+  it('skips route generation when dependency install is skipped', async () => {
+    const { environment, output } = createMemoryEnvironment()
+    await createApp(environment, {
+      ...simpleOptions,
+      framework: {
+        ...simpleOptions.framework,
+        id: 'react',
+      },
+      install: false,
+    })
+
+    expect(output.commands).not.toContainEqual({
+      command: 'pnpm',
+      args: ['generate-routes'],
+    })
+  })
+
   it('should create an app - with a add-on', async () => {
     const { environment, output } = createMemoryEnvironment()
     await createApp(environment, {

packages/create/tests/framework-template.test.ts

@@ -7,9 +7,28 @@ describe('framework templates', () => {
   it.each([
     ['React', createReactFrameworkDefinition],
     ['Solid', createSolidFrameworkDefinition],
-  ])('%s gitignore excludes the generated route tree', (_, createDefinition) => {
+  ])(
+    '%s gitignore does not exclude the generated route tree',
+    (_, createDefinition) => {
+      const framework = createDefinition()
+
+      expect(framework.base._dot_gitignore).not.toContain(
+        'src/routeTree.gen.ts',
+      )
+    },
+  )
+
+  it.each([
+    ['React', createReactFrameworkDefinition],
+    ['Solid', createSolidFrameworkDefinition],
+  ])('%s includes route generation tooling', (_, createDefinition) => {
     const framework = createDefinition()
 
-    expect(framework.base._dot_gitignore).toContain('src/routeTree.gen.ts')
+    expect(framework.base['package.json']).toContain(
+      '"generate-routes": "tsr generate"',
+    )
+    expect(
+      framework.optionalPackages['file-router'].devDependencies,
+    ).toHaveProperty('@tanstack/router-cli')
   })
 })