@tanstack/router-vite-plugin 1.32.2 → 1.32.17

package/src/compilers.ts

@@ -91,7 +91,35 @@ export async function compileFile(opts: {
                     {
                       CallExpression: (path) => {
                         if (path.node.callee.type === 'Identifier') {
-                          if (
+                          if (path.node.callee.name === 'createServerFn') {
+                            // If the function at createServerFn(_, MyFunc) doesn't have a
+                            // 'use server' directive at the top of the function scope,
+                            // then add it.
+
+                            const fn = path.node.arguments[1]
+
+                            if (
+                              t.isFunctionExpression(fn) ||
+                              t.isArrowFunctionExpression(fn)
+                            ) {
+                              if (t.isBlockStatement(fn.body)) {
+                                const hasUseServerDirective =
+                                  fn.body.directives.some((directive) => {
+                                    return (
+                                      directive.value.value === 'use server'
+                                    )
+                                  })
+
+                                if (!hasUseServerDirective) {
+                                  fn.body.directives.unshift(
+                                    t.directive(
+                                      t.directiveLiteral('use server'),
+                                    ),
+                                  )
+                                }
+                              }
+                            }
+                          } else if (
                             path.node.callee.name === 'createRoute' ||
                             path.node.callee.name === 'createFileRoute'
                           ) {
@@ -105,6 +133,12 @@ export async function compileFile(opts: {
 
                               let found = false
 
+                              const hasImportedOrDefinedIdentifier = (
+                                name: string,
+                              ) => {
+                                return programPath.scope.hasBinding(name)
+                              }
+
                               if (t.isObjectExpression(options)) {
                                 options.properties.forEach((prop) => {
                                   if (t.isObjectProperty(prop)) {
@@ -117,15 +151,32 @@ export async function compileFile(opts: {
                                         }
 
                                         // Prepend the import statement to the program along with the importer function
+                                        // Check to see if lazyRouteComponent is already imported before attempting
+                                        // to import it again
+
+                                        if (
+                                          !hasImportedOrDefinedIdentifier(
+                                            'lazyRouteComponent',
+                                          )
+                                        ) {
+                                          programPath.unshiftContainer('body', [
+                                            template.smart(
+                                              `import { lazyRouteComponent } from '@tanstack/react-router'`,
+                                            )() as t.Statement,
+                                          ])
+                                        }
 
-                                        programPath.unshiftContainer('body', [
-                                          template.smart(
-                                            `import { lazyRouteComponent } from '@tanstack/react-router'`,
-                                          )() as t.Statement,
-                                          template.smart(
-                                            `const $$splitComponentImporter = () => import('${splitUrl}')`,
-                                          )() as t.Statement,
-                                        ])
+                                        if (
+                                          !hasImportedOrDefinedIdentifier(
+                                            '$$splitComponentImporter',
+                                          )
+                                        ) {
+                                          programPath.unshiftContainer('body', [
+                                            template.smart(
+                                              `const $$splitComponentImporter = () => import('${splitUrl}')`,
+                                            )() as t.Statement,
+                                          ])
+                                        }
 
                                         prop.value = template.expression(
                                           `lazyRouteComponent($$splitComponentImporter, 'component')`,
@@ -147,14 +198,29 @@ export async function compileFile(opts: {
 
                                         // Prepend the import statement to the program along with the importer function
 
-                                        programPath.unshiftContainer('body', [
-                                          template.smart(
-                                            `import { lazyFn } from '@tanstack/react-router'`,
-                                          )() as t.Statement,
-                                          template.smart(
-                                            `const $$splitLoaderImporter = () => import('${splitUrl}')`,
-                                          )() as t.Statement,
-                                        ])
+                                        if (
+                                          !hasImportedOrDefinedIdentifier(
+                                            'lazyFn',
+                                          )
+                                        ) {
+                                          programPath.unshiftContainer('body', [
+                                            template.smart(
+                                              `import { lazyFn } from '@tanstack/react-router'`,
+                                            )() as t.Statement,
+                                          ])
+                                        }
+
+                                        if (
+                                          !hasImportedOrDefinedIdentifier(
+                                            '$$splitLoaderImporter',
+                                          )
+                                        ) {
+                                          programPath.unshiftContainer('body', [
+                                            template.smart(
+                                              `const $$splitLoaderImporter = () => import('${splitUrl}')`,
+                                            )() as t.Statement,
+                                          ])
+                                        }
 
                                         prop.value = template.expression(
                                           `lazyFn($$splitLoaderImporter, 'loader')`,
@@ -164,6 +230,8 @@ export async function compileFile(opts: {
                                       }
                                     }
                                   }
+
+                                  programPath.scope.crawl()
                                 })
                               }
 
@@ -259,7 +327,38 @@ export async function splitFile(opts: {
                     {
                       CallExpression: (path) => {
                         if (path.node.callee.type === 'Identifier') {
-                          if (path.node.callee.name === 'createFileRoute') {
+                          if (path.node.callee.name === 'createServerFn') {
+                            // If the function at createServerFn(_, MyFunc) doesn't have a
+                            // 'use server' directive at the top of the function scope,
+                            // then add it.
+
+                            const fn = path.node.arguments[1]
+
+                            if (
+                              t.isFunctionExpression(fn) ||
+                              t.isArrowFunctionExpression(fn)
+                            ) {
+                              if (t.isBlockStatement(fn.body)) {
+                                const hasUseServerDirective =
+                                  fn.body.directives.some((directive) => {
+                                    return (
+                                      directive.value.value === 'use server'
+                                    )
+                                  })
+
+                                if (!hasUseServerDirective) {
+                                  fn.body.directives.unshift(
+                                    t.directive(
+                                      t.directiveLiteral('use server'),
+                                    ),
+                                  )
+                                }
+                              }
+                            }
+                          } else if (
+                            path.node.callee.name === 'createRoute' ||
+                            path.node.callee.name === 'createFileRoute'
+                          ) {
                             if (
                               path.parentPath.node.type === 'CallExpression'
                             ) {

package/src/eliminateUnreferencedIdentifiers.ts

@@ -7,93 +7,6 @@ import type { NodePath } from '@babel/traverse'
 
 type IdentifierPath = NodePath<BabelTypes.Identifier>
 
-// export function findReferencedIdentifiers(
-//   programPath: NodePath<BabelTypes.Program>,
-// ): Set<IdentifierPath> {
-//   const refs = new Set<IdentifierPath>()
-
-//   function markFunction(
-//     path: NodePath<
-//       | BabelTypes.FunctionDeclaration
-//       | BabelTypes.FunctionExpression
-//       | BabelTypes.ArrowFunctionExpression
-//     >,
-//   ) {
-//     const ident = getIdentifier(path)
-//     if (ident?.node && isIdentifierReferenced(ident)) {
-//       refs.add(ident)
-//     }
-//   }
-
-//   function markImport(
-//     path: NodePath<
-//       | BabelTypes.ImportSpecifier
-//       | BabelTypes.ImportDefaultSpecifier
-//       | BabelTypes.ImportNamespaceSpecifier
-//     >,
-//   ) {
-//     const local = path.get('local')
-//     if (isIdentifierReferenced(local)) {
-//       refs.add(local)
-//     }
-//   }
-
-//   programPath.traverse({
-//     VariableDeclarator(path) {
-//       if (path.node.id.type === 'Identifier') {
-//         const local = path.get('id') as NodePath<BabelTypes.Identifier>
-//         if (isIdentifierReferenced(local)) {
-//           refs.add(local)
-//         }
-//       } else if (path.node.id.type === 'ObjectPattern') {
-//         const pattern = path.get('id') as NodePath<BabelTypes.ObjectPattern>
-
-//         const properties = pattern.get('properties')
-//         properties.forEach((p) => {
-//           const local = p.get(
-//             p.node.type === 'ObjectProperty'
-//               ? 'value'
-//               : p.node.type === 'RestElement'
-//                 ? 'argument'
-//                 : (function () {
-//                     throw new Error('invariant')
-//                   })(),
-//           ) as NodePath<BabelTypes.Identifier>
-//           if (isIdentifierReferenced(local)) {
-//             refs.add(local)
-//           }
-//         })
-//       } else if (path.node.id.type === 'ArrayPattern') {
-//         const pattern = path.get('id') as NodePath<BabelTypes.ArrayPattern>
-
-//         const elements = pattern.get('elements')
-//         elements.forEach((e) => {
-//           let local: NodePath<BabelTypes.Identifier>
-//           if (e.node?.type === 'Identifier') {
-//             local = e as NodePath<BabelTypes.Identifier>
-//           } else if (e.node?.type === 'RestElement') {
-//             local = e.get('argument') as NodePath<BabelTypes.Identifier>
-//           } else {
-//             return
-//           }
-
-//           if (isIdentifierReferenced(local)) {
-//             refs.add(local)
-//           }
-//         })
-//       }
-//     },
-
-//     FunctionDeclaration: markFunction,
-//     FunctionExpression: markFunction,
-//     ArrowFunctionExpression: markFunction,
-//     ImportSpecifier: markImport,
-//     ImportDefaultSpecifier: markImport,
-//     ImportNamespaceSpecifier: markImport,
-//   })
-//   return refs
-// }
-
 /**
  * @param refs - If provided, only these identifiers will be considered for removal.
  */
@@ -150,6 +63,30 @@ export const eliminateUnreferencedIdentifiers = (
     }
   }
 
+  const handleObjectPattern = (pattern: NodePath<BabelTypes.ObjectPattern>) => {
+    const properties = pattern.get('properties')
+    properties.forEach((property) => {
+      if (property.node.type === 'ObjectProperty') {
+        const value = property.get('value') as any
+        if (t.isIdentifier(value)) {
+          if (shouldBeRemoved(value as any)) {
+            property.remove()
+          }
+        } else if (t.isObjectPattern(value)) {
+          handleObjectPattern(value as any)
+        }
+      } else if (t.isRestElement(property.node)) {
+        const argument = property.get('argument')
+        if (
+          t.isIdentifier(argument as any) &&
+          shouldBeRemoved(argument as NodePath<BabelTypes.Identifier>)
+        ) {
+          property.remove()
+        }
+      }
+    })
+  }
+
   // Traverse again to remove unused references. This happens at least once,
   // then repeats until no more references are removed.
   do {
@@ -166,34 +103,9 @@ export const eliminateUnreferencedIdentifiers = (
             path.remove()
           }
         } else if (path.node.id.type === 'ObjectPattern') {
-          const pattern = path.get('id') as NodePath<BabelTypes.ObjectPattern>
-
-          const beforeCount = referencesRemovedInThisPass
-          const properties = pattern.get('properties')
-          properties.forEach((property) => {
-            const local = property.get(
-              property.node.type === 'ObjectProperty'
-                ? 'value'
-                : // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-                  property.node.type === 'RestElement'
-                  ? 'argument'
-                  : (function () {
-                      throw new Error('invariant')
-                    })(),
-            ) as NodePath<BabelTypes.Identifier>
-
-            if (shouldBeRemoved(local)) {
-              ++referencesRemovedInThisPass
-              property.remove()
-            }
-          })
-
-          if (
-            beforeCount !== referencesRemovedInThisPass &&
-            pattern.get('properties').length < 1
-          ) {
-            path.remove()
-          }
+          handleObjectPattern(
+            path.get('id') as NodePath<BabelTypes.ObjectPattern>,
+          )
         } else if (path.node.id.type === 'ArrayPattern') {
           const pattern = path.get('id') as NodePath<BabelTypes.ArrayPattern>
 

package/src/index.ts

@@ -22,7 +22,7 @@ export const configSchema = generatorConfigSchema.extend({
 export type Config = z.infer<typeof configSchema>
 
 const CONFIG_FILE_NAME = 'tsr.config.json'
-const debug = false as any
+const debug = Boolean(process.env.TSR_VITE_DEBUG)
 
 const getConfig = async (inlineConfig: Partial<Config>, root: string) => {
   const config = await getGeneratorConfig(inlineConfig, root)
@@ -66,10 +66,12 @@ export function TanStackRouterViteGenerator(
     event: 'create' | 'update' | 'delete',
   ) => {
     const filePath = normalize(file)
+
     if (filePath === join(ROOT, CONFIG_FILE_NAME)) {
       userConfig = await getConfig(inlineConfig, ROOT)
       return
     }
+
     if (
       event === 'update' &&
       filePath === resolve(userConfig.generatedRouteTree)
@@ -77,9 +79,11 @@ export function TanStackRouterViteGenerator(
       // skip generating routes if the generated route tree is updated
       return
     }
+
     const routesDirectoryPath = isAbsolute(userConfig.routesDirectory)
       ? userConfig.routesDirectory
       : join(ROOT, userConfig.routesDirectory)
+
     if (filePath.startsWith(routesDirectoryPath)) {
       await generate()
     }
@@ -90,7 +94,6 @@ export function TanStackRouterViteGenerator(
     configResolved: async (config) => {
       ROOT = process.cwd()
       userConfig = await getConfig(inlineConfig, ROOT)
-
       if (userConfig.enableRouteGeneration ?? true) {
         await generate()
       }
@@ -175,8 +178,10 @@ export function TanStackRouterViteCodeSplitter(
 
         return compiled
       } else if (
-        fileIsInRoutesDirectory(id, userConfig.routesDirectory) &&
-        (code.includes('createRoute(') || code.includes('createFileRoute('))
+        (fileIsInRoutesDirectory(id, userConfig.routesDirectory) &&
+          (code.includes('createRoute(') ||
+            code.includes('createFileRoute('))) ||
+        code.includes('createServerFn')
       ) {
         if (code.includes('@react-refresh')) {
           throw new Error(