@tanstack/router-plugin 1.121.6 → 1.121.9

package/src/core/router-code-splitter-plugin.ts

@@ -17,9 +17,9 @@ import {
   tsrSplit,
 } from './constants'
 import { decodeIdentifier } from './code-splitter/path-ids'
-import { debug, fileIsInRoutesDirectory } from './utils'
+import { debug } from './utils'
 import type { CodeSplitGroupings, SplitRouteIdentNodes } from './constants'
-
+import type { GetRoutesByFileMapResultValue } from '@tanstack/router-generator'
 import type { Config } from './config'
 import type {
   UnpluginContextMeta,
@@ -27,10 +27,6 @@ import type {
   TransformResult as UnpluginTransformResult,
 } from 'unplugin'
 
-function capitalizeFirst(str: string): string {
-  return str.charAt(0).toUpperCase() + str.slice(1)
-}
-
 type BannedBeforeExternalPlugin = {
   identifier: string
   pkg: string
@@ -48,11 +44,14 @@ const bannedBeforeExternalPlugins: Array<BannedBeforeExternalPlugin> = [
 ]
 
 class FoundPluginInBeforeCode extends Error {
-  constructor(externalPlugin: BannedBeforeExternalPlugin, framework: string) {
-    super(`We detected that the '${externalPlugin.pkg}' was passed before '@tanstack/router-plugin'. Please make sure that '@tanstack/router-plugin' is passed before '${externalPlugin.pkg}' and try again: 
+  constructor(
+    externalPlugin: BannedBeforeExternalPlugin,
+    pluginFramework: string,
+  ) {
+    super(`We detected that the '${externalPlugin.pkg}' was passed before '@tanstack/router-plugin/${pluginFramework}'. Please make sure that '@tanstack/router-plugin' is passed before '${externalPlugin.pkg}' and try again: 
 e.g.
 plugins: [
-  TanStackRouter${capitalizeFirst(framework)}(), // Place this before ${externalPlugin.usage}
+  tanstackRouter(), // Place this before ${externalPlugin.usage}
   ${externalPlugin.usage},
 ]
 `)
@@ -82,6 +81,7 @@ export const unpluginRouterCodeSplitterFactory: UnpluginFactory<
   const handleCompilingReferenceFile = (
     code: string,
     id: string,
+    generatorNodeInfo: GetRoutesByFileMapResultValue,
   ): UnpluginTransformResult => {
     if (debug) console.info('Compiling Route: ', id)
 
@@ -102,7 +102,7 @@ export const unpluginRouterCodeSplitterFactory: UnpluginFactory<
     const userShouldSplitFn = getShouldSplitFn()
 
     const pluginSplitBehavior = userShouldSplitFn?.({
-      routeId: fromCode.routeId,
+      routeId: generatorNodeInfo.routePath,
     }) as CodeSplitGroupings | undefined
 
     if (pluginSplitBehavior) {
@@ -171,83 +171,79 @@ export const unpluginRouterCodeSplitterFactory: UnpluginFactory<
     return result
   }
 
-  return {
-    name: 'router-code-splitter-plugin',
-    enforce: 'pre',
-
-    transform(code, id) {
-      if (!userConfig.autoCodeSplitting) {
-        return null
-      }
-
-      const url = pathToFileURL(id)
-      url.searchParams.delete('v')
-      id = fileURLToPath(url).replace(/\\/g, '/')
-
-      if (id.includes(tsrSplit)) {
-        return handleCompilingVirtualFile(code, id)
-      } else if (
-        fileIsInRoutesDirectory(id, userConfig.routesDirectory) &&
-        (code.includes('createRoute(') || code.includes('createFileRoute('))
-      ) {
-        for (const externalPlugin of bannedBeforeExternalPlugins) {
-          if (!externalPlugin.frameworks.includes(framework)) {
-            continue
-          }
-
-          if (code.includes(externalPlugin.identifier)) {
-            throw new FoundPluginInBeforeCode(externalPlugin, framework)
+  return [
+    {
+      name: 'tanstack-router:code-splitter:compile-reference-file',
+      enforce: 'pre',
+
+      transform: {
+        filter: {
+          id: {
+            exclude: tsrSplit,
+          },
+          code: 'createFileRoute(',
+        },
+        handler(code, id) {
+          const generatorFileInfo = globalThis.TSR_ROUTES_BY_ID_MAP?.get(id)
+          if (generatorFileInfo && code.includes('createFileRoute(')) {
+            for (const externalPlugin of bannedBeforeExternalPlugins) {
+              if (!externalPlugin.frameworks.includes(framework)) {
+                continue
+              }
+
+              if (code.includes(externalPlugin.identifier)) {
+                throw new FoundPluginInBeforeCode(externalPlugin, framework)
+              }
+            }
+
+            return handleCompilingReferenceFile(code, id, generatorFileInfo)
           }
-        }
-
-        return handleCompilingReferenceFile(code, id)
-      }
-
-      return null
-    },
-
-    transformInclude(id) {
-      if (!userConfig.autoCodeSplitting) {
-        return undefined
-      }
 
-      if (
-        fileIsInRoutesDirectory(id, userConfig.routesDirectory) ||
-        id.includes(tsrSplit)
-      ) {
-        return true
-      }
-      return false
-    },
+          return null
+        },
+      },
 
-    vite: {
-      configResolved(config) {
-        ROOT = config.root
+      vite: {
+        configResolved(config) {
+          ROOT = config.root
+          userConfig = getConfig(options, ROOT)
+        },
+      },
 
+      rspack() {
+        ROOT = process.cwd()
         userConfig = getConfig(options, ROOT)
       },
-    },
 
-    rspack(_compiler) {
-      ROOT = process.cwd()
-      userConfig = getConfig(options, ROOT)
-    },
+      webpack(compiler) {
+        ROOT = process.cwd()
+        userConfig = getConfig(options, ROOT)
 
-    webpack(compiler) {
-      ROOT = process.cwd()
-      userConfig = getConfig(options, ROOT)
-
-      if (
-        userConfig.autoCodeSplitting &&
-        compiler.options.mode === 'production'
-      ) {
-        compiler.hooks.done.tap(PLUGIN_NAME, () => {
-          console.info('✅ ' + PLUGIN_NAME + ': code-splitting done!')
-          setTimeout(() => {
-            process.exit(0)
+        if (compiler.options.mode === 'production') {
+          compiler.hooks.done.tap(PLUGIN_NAME, () => {
+            console.info('✅ ' + PLUGIN_NAME + ': code-splitting done!')
+            setTimeout(() => {
+              process.exit(0)
+            })
           })
-        })
-      }
+        }
+      },
     },
-  }
+    {
+      name: 'tanstack-router:code-splitter:compile-virtual-file',
+      enforce: 'pre',
+
+      transform: {
+        filter: {
+          id: /tsr-split/,
+        },
+        handler(code, id) {
+          const url = pathToFileURL(id)
+          url.searchParams.delete('v')
+          id = fileURLToPath(url).replace(/\\/g, '/')
+          return handleCompilingVirtualFile(code, id)
+        },
+      },
+    },
+  ]
 }

package/src/core/router-composed-plugin.ts

@@ -20,7 +20,13 @@ export const unpluginRouterComposedFactory: UnpluginFactory<
   const routerCodeSplitter = getPlugin(unpluginRouterCodeSplitterFactory)
   const routeAutoImport = getPlugin(unpluginRouteAutoImportFactory)
 
-  const result = [...routerGenerator, ...routerCodeSplitter, ...routeAutoImport]
+  const result = [...routerGenerator]
+  if (options.autoCodeSplitting) {
+    result.push(...routerCodeSplitter)
+  }
+  if (options.verboseFileRoutes === false) {
+    result.push(...routeAutoImport)
+  }
 
   const isProduction = process.env.NODE_ENV === 'production'
 

package/src/core/router-generator-plugin.ts

@@ -1,7 +1,8 @@
 import { isAbsolute, join, normalize } from 'node:path'
 import { Generator, resolveConfigPath } from '@tanstack/router-generator'
-
 import { getConfig } from './config'
+
+import type { GeneratorEvent } from '@tanstack/router-generator'
 import type { FSWatcher } from 'chokidar'
 import type { UnpluginFactory } from 'unplugin'
 import type { Config } from './config'
@@ -31,41 +32,39 @@ export const unpluginRouterGeneratorFactory: UnpluginFactory<
     })
   }
 
-  const generate = async () => {
+  const generate = async (opts?: {
+    file: string
+    event: 'create' | 'update' | 'delete'
+  }) => {
     if (routeGenerationDisabled()) {
       return
     }
-    try {
-      await generator.run()
-    } catch (e) {
-      console.error(e)
+    let generatorEvent: GeneratorEvent | undefined = undefined
+    if (opts) {
+      const filePath = normalize(opts.file)
+      if (filePath === resolveConfigPath({ configDirectory: ROOT })) {
+        initConfigAndGenerator()
+        return
+      }
+      generatorEvent = { path: filePath, type: opts.event }
     }
-  }
-
-  const handleFile = async (
-    file: string,
-    event: 'create' | 'update' | 'delete',
-  ) => {
-    const filePath = normalize(file)
 
-    if (filePath === resolveConfigPath({ configDirectory: ROOT })) {
-      initConfigAndGenerator()
-      return
-    }
     try {
-      await generator.run({ path: filePath, type: event })
+      await generator.run(generatorEvent)
+      globalThis.TSR_ROUTES_BY_ID_MAP = generator.getRoutesByFileMap()
     } catch (e) {
       console.error(e)
     }
   }
 
   return {
-    name: 'router-generator-plugin',
+    name: 'tanstack:router-generator',
     enforce: 'pre',
     async watchChange(id, { event }) {
-      if (!routeGenerationDisabled()) {
-        await handleFile(id, event)
-      }
+      await generate({
+        file: id,
+        event,
+      })
     },
     async buildStart() {
       await generate()
@@ -89,7 +88,7 @@ export const unpluginRouterGeneratorFactory: UnpluginFactory<
 
       let handle: FSWatcher | null = null
 
-      compiler.hooks.beforeRun.tapPromise(PLUGIN_NAME, generate)
+      compiler.hooks.beforeRun.tapPromise(PLUGIN_NAME, () => generate())
 
       compiler.hooks.watchRun.tapPromise(PLUGIN_NAME, async () => {
         if (handle) {
@@ -117,7 +116,7 @@ export const unpluginRouterGeneratorFactory: UnpluginFactory<
 
       let handle: FSWatcher | null = null
 
-      compiler.hooks.beforeRun.tapPromise(PLUGIN_NAME, generate)
+      compiler.hooks.beforeRun.tapPromise(PLUGIN_NAME, () => generate())
 
       compiler.hooks.watchRun.tapPromise(PLUGIN_NAME, async () => {
         if (handle) {

package/src/core/router-hmr-plugin.ts

@@ -1,7 +1,7 @@
 import { generateFromAst, logDiff, parseAst } from '@tanstack/router-utils'
 import { getConfig } from './config'
 import { routeHmrStatement } from './route-hmr-statement'
-import { debug, fileIsInRoutesDirectory } from './utils'
+import { debug } from './utils'
 import type { Config } from './config'
 import type { UnpluginFactory } from 'unplugin'
 
@@ -17,32 +17,33 @@ export const unpluginRouterHmrFactory: UnpluginFactory<
   let userConfig = options as Config
 
   return {
-    name: 'router-hmr-plugin',
+    name: 'tanstack-router:hmr',
     enforce: 'pre',
 
-    transform(code, id) {
-      if (!code.includes('export const Route = createFileRoute(')) {
-        return null
-      }
-
-      if (debug) console.info('Adding HMR handling to route ', id)
+    transform: {
+      filter: {
+        code: 'createFileRoute(',
+      },
+      handler(code, id) {
+        if (!globalThis.TSR_ROUTES_BY_ID_MAP?.has(id)) {
+          return null
+        }
 
-      const ast = parseAst({ code })
-      ast.program.body.push(routeHmrStatement)
-      const result = generateFromAst(ast, {
-        sourceMaps: true,
-        filename: id,
-        sourceFileName: id,
-      })
-      if (debug) {
-        logDiff(code, result.code)
-        console.log('Output:\n', result.code + '\n\n')
-      }
-      return result
-    },
+        if (debug) console.info('Adding HMR handling to route ', id)
 
-    transformInclude(id) {
-      return fileIsInRoutesDirectory(id, userConfig.routesDirectory)
+        const ast = parseAst({ code })
+        ast.program.body.push(routeHmrStatement)
+        const result = generateFromAst(ast, {
+          sourceMaps: true,
+          filename: id,
+          sourceFileName: id,
+        })
+        if (debug) {
+          logDiff(code, result.code)
+          console.log('Output:\n', result.code + '\n\n')
+        }
+        return result
+      },
     },
 
     vite: {

package/src/core/utils.ts

@@ -1,18 +1,3 @@
-import { isAbsolute, join, normalize } from 'node:path'
-
 export const debug =
   process.env.TSR_VITE_DEBUG &&
   ['true', 'router-plugin'].includes(process.env.TSR_VITE_DEBUG)
-
-export function fileIsInRoutesDirectory(
-  filePath: string,
-  routesDirectory: string,
-): boolean {
-  const routesDirectoryPath = isAbsolute(routesDirectory)
-    ? routesDirectory
-    : join(process.cwd(), routesDirectory)
-
-  const path = normalize(filePath)
-
-  return path.startsWith(routesDirectoryPath)
-}

package/src/global.d.ts

@@ -0,0 +1,7 @@
+/* eslint-disable no-var */
+import type { GetRoutesByFileMapResult } from '@tanstack/router-generator'
+
+declare global {
+  var TSR_ROUTES_BY_ID_MAP: GetRoutesByFileMapResult | undefined
+}
+export {}