fix(router-plugin): handle explicit undefined component in code splitter

Author: wtlin1228

packages/router-plugin/src/core/code-splitter/compilers.ts

@@ -620,6 +620,16 @@ export function compileCodeSplitVirtualRoute(
               console.info('Unexpected splitNode type:', splitNode)
               throw new Error(`Unexpected splitNode type ☝️: ${splitNode.type}`)
             }
+          } else if (splitNode === undefined) {
+            programPath.pushContainer(
+              'body',
+              t.variableDeclaration('const', [
+                t.variableDeclarator(
+                  t.identifier(splitMeta.localExporterIdent),
+                  t.identifier('undefined'),
+                ),
+              ]),
+            )
           }
 
           // If the splitNode exists at the top of the program

packages/router-plugin/tests/code-splitter/snapshots/react/1-default/development/explicit-undefined-component.tsx

@@ -0,0 +1,14 @@
+const $$splitComponentImporter = () => import('explicit-undefined-component.tsx?tsr-split=component');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import React from 'react';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+  component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
+if (import.meta.hot) {
+  import.meta.hot.accept(newModule => {
+    if (newModule && newModule.Route && typeof newModule.Route.clone === 'function') {
+      newModule.Route.clone(Route);
+    }
+  });
+}

packages/router-plugin/tests/code-splitter/snapshots/react/1-default/development/explicit-undefined-component@component.tsx

@@ -0,0 +1,4 @@
+import React from 'react';
+import { Route } from "explicit-undefined-component.tsx";
+const SplitComponent = undefined;
+export { SplitComponent as component };

packages/router-plugin/tests/code-splitter/snapshots/react/1-default/development/explicit-undefined-component@errorComponent.tsx

@@ -0,0 +1,2 @@
+import React from 'react';
+import { Route } from "explicit-undefined-component.tsx";

packages/router-plugin/tests/code-splitter/snapshots/react/1-default/development/explicit-undefined-component@notFoundComponent.tsx

@@ -0,0 +1,2 @@
+import React from 'react';
+import { Route } from "explicit-undefined-component.tsx";

packages/router-plugin/tests/code-splitter/snapshots/react/1-default/production/explicit-undefined-component.tsx

@@ -0,0 +1,7 @@
+const $$splitComponentImporter = () => import('explicit-undefined-component.tsx?tsr-split=component');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import React from 'react';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+  component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});

packages/router-plugin/tests/code-splitter/snapshots/react/1-default/production/explicit-undefined-component@component.tsx

@@ -0,0 +1,4 @@
+import React from 'react';
+import { Route } from "explicit-undefined-component.tsx";
+const SplitComponent = undefined;
+export { SplitComponent as component };

packages/router-plugin/tests/code-splitter/snapshots/react/1-default/production/explicit-undefined-component@errorComponent.tsx

@@ -0,0 +1,2 @@
+import React from 'react';
+import { Route } from "explicit-undefined-component.tsx";

packages/router-plugin/tests/code-splitter/snapshots/react/1-default/production/explicit-undefined-component@notFoundComponent.tsx

@@ -0,0 +1,2 @@
+import React from 'react';
+import { Route } from "explicit-undefined-component.tsx";

packages/router-plugin/tests/code-splitter/snapshots/react/2-components-combined-loader-separate/development/explicit-undefined-component.tsx

@@ -0,0 +1,14 @@
+const $$splitComponentImporter = () => import('explicit-undefined-component.tsx?tsr-split=component---errorComponent---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import React from 'react';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+  component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
+if (import.meta.hot) {
+  import.meta.hot.accept(newModule => {
+    if (newModule && newModule.Route && typeof newModule.Route.clone === 'function') {
+      newModule.Route.clone(Route);
+    }
+  });
+}