Repository: TanStack/router
Pull request #1502 (2024-04-20 12:21:49)

feat(router-generator): prepend and append user content to the generated route-tree file
From this comment: https://github.com/TanStack/router/pull/1496#issuecomment-2067631665

This change allows a user to prepend and append lines to the generated route-tree file by letting them configure an array of strings for each property.

nx-cloud[bot]: # ☁️ Nx Cloud Report

CI is running for commit 906170b9fc9573a0a411671ebbf4d79c1333c630.

[📂 Click to track the progress, see the status, the terminal output, and the build insights.](https://cloud.nx.app/cipes/6623b37c2b21fe0318fdd8f8?utm_source=pull-request&utm_medium=comment)


---

Sent with 💌 from [NxCloud.](https://nx.app?utm_source=pull-request&utm_medium=comment)

Patch:
diff --git a/docs/framework/react/guide/file-based-routing.md b/docs/framework/react/guide/file-based-routing.md
index 15fa5f6c7..73ed7a1c4 100644
--- a/docs/framework/react/guide/file-based-routing.md
+++ b/docs/framework/react/guide/file-based-routing.md
@@ -109,6 +109,27 @@ The following options are available for configuration via the `tsr.config.json`
   - (Optional, **Defaults to `false`**) add file extensions to the route names in the generated route tree
 - **`disableLogging`**
   - (Optional, **Defaults to `false`**) disables logging for the route generation process
+- **`routeTreeFileHeader`**
+
+  - (Optional) An array of strings to prepend to the generated route tree file content.
+  - Default:
+  - ```
+    [
+      '/* prettier-ignore-start */',
+      '/* eslint-disable */',
+      '// @ts-nocheck',
+      '// noinspection JSUnusedGlobalSymbols'
+    ]
+    ```
+
+- **`routeTreeFileFooter`**
+  - (Optional) An array of strings to append to the generated route tree file content.
+  - Default:
+  - ```
+    [
+      '/* prettier-ignore-end */'
+    ]
+    ```
 
 ## File Naming Conventions
 
diff --git a/packages/router-generator/src/config.ts b/packages/router-generator/src/config.ts
index 1339513b7..2bd1cbe54 100644
--- a/packages/router-generator/src/config.ts
+++ b/packages/router-generator/src/config.ts
@@ -13,6 +13,19 @@ export const configSchema = z.object({
   disableTypes: z.boolean().optional().default(false),
   addExtensions: z.boolean().optional().default(false),
   disableLogging: z.boolean().optional().default(false),
+  routeTreeFileHeader: z
+    .array(z.string())
+    .optional()
+    .default([
+      '/* prettier-ignore-start */',
+      '/* eslint-disable */',
+      '// @ts-nocheck',
+      '// noinspection JSUnusedGlobalSymbols',
+    ]),
+  routeTreeFileFooter: z
+    .array(z.string())
+    .optional()
+    .default(['/* prettier-ignore-end */']),
 })
 
 export type Config = z.infer<typeof configSchema>
diff --git a/packages/router-generator/src/generator.ts b/packages/router-generator/src/generator.ts
index 7b541409a..8da141522 100644
--- a/packages/router-generator/src/generator.ts
+++ b/packages/router-generator/src/generator.ts
@@ -457,10 +457,7 @@ export async function generator(config: Config) {
       : ''
 
   const routeImports = [
-    '/* prettier-ignore-start */',
-    '/* eslint-disable */',
-    '// @ts-nocheck',
-    '// noinspection JSUnusedGlobalSymbols',
+    ...config.routeTreeFileHeader,
     '// This file is auto-generated by TanStack Router',
     imports.length
       ? `import { ${imports.join(', ')} } from '@tanstack/react-router'\n`
@@ -603,7 +600,7 @@ export async function generator(config: Config) {
         ]),
     '// Create and export the route tree',
     `export const routeTree = rootRoute.addChildren([${routeConfigChildrenText}])`,
-    '/* prettier-ignore-end */',
+    ...config.routeTreeFileFooter,
   ]
     .filter(Boolean)
     .join('\n\n')


Test patch:
diff --git a/packages/router-generator/tests/generator.test.ts b/packages/router-generator/tests/generator.test.ts
index 0b3aeb1ad..94ccff100 100644
--- a/packages/router-generator/tests/generator.test.ts
+++ b/packages/router-generator/tests/generator.test.ts
@@ -41,7 +41,18 @@ async function getExpectedRouteTreeFileText(folder: string) {
   return text
 }
 
-describe('with a default config', async () => {
+function rewriteConfigByFolderName(folderName: string, config: Config) {
+  switch (folderName) {
+    case 'append-and-prepend':
+      config.routeTreeFileHeader = ['// prepend1', '// prepend2']
+      config.routeTreeFileFooter = ['// append1', '// append2']
+      break
+    default:
+      break
+  }
+}
+
+describe('generator works', async () => {
   const folderNames = await getFoldersNames()
 
   it.each(folderNames.map((folder) => [folder]))(
@@ -49,6 +60,8 @@ describe('with a default config', async () => {
     async (folderName) => {
       const config = await setupConfig(folderName)
 
+      rewriteConfigByFolderName(folderName, config)
+
       await generator(config)
 
       const [expectedRouteTree, generatedRouteTree] = await Promise.all([
diff --git a/packages/router-generator/tests/generator/append-and-prepend/routeTree.expected.ts b/packages/router-generator/tests/generator/append-and-prepend/routeTree.expected.ts
new file mode 100644
index 000000000..d4de97299
--- /dev/null
+++ b/packages/router-generator/tests/generator/append-and-prepend/routeTree.expected.ts
@@ -0,0 +1,36 @@
+// prepend1
+
+// prepend2
+
+// This file is auto-generated by TanStack Router
+
+// Import Routes
+
+import { Route as rootRoute } from './routes/__root'
+import { Route as IndexImport } from './routes/index'
+
+// Create/Update Routes
+
+const IndexRoute = IndexImport.update({
+  path: '/',
+  getParentRoute: () => rootRoute,
+} as any)
+
+// Populate the FileRoutesByPath interface
+
+declare module '@tanstack/react-router' {
+  interface FileRoutesByPath {
+    '/': {
+      preLoaderRoute: typeof IndexImport
+      parentRoute: typeof rootRoute
+    }
+  }
+}
+
+// Create and export the route tree
+
+export const routeTree = rootRoute.addChildren([IndexRoute])
+
+// append1
+
+// append2
diff --git a/packages/router-generator/tests/generator/append-and-prepend/routes/__root.tsx b/packages/router-generator/tests/generator/append-and-prepend/routes/__root.tsx
new file mode 100644
index 000000000..ab504e42e
--- /dev/null
+++ b/packages/router-generator/tests/generator/append-and-prepend/routes/__root.tsx
@@ -0,0 +1,1 @@
+/** */
diff --git a/packages/router-generator/tests/generator/append-and-prepend/routes/index.tsx b/packages/router-generator/tests/generator/append-and-prepend/routes/index.tsx
new file mode 100644
index 000000000..ab504e42e
--- /dev/null
+++ b/packages/router-generator/tests/generator/append-and-prepend/routes/index.tsx
@@ -0,0 +1,1 @@
+/** */