fix: initialize import.meta.hot.data before storing stable split componts

.changeset/five-sheep-grin.md

@@ -0,0 +1,5 @@
+---
+'@tanstack/router-plugin': patch
+---
+
+Initialize `import.meta.hot.data` before storing stable split components so Vitest does not crash when HMR data is missing.

packages/router-plugin/src/core/code-splitter/plugins/react-stable-hmr-split-route-components.ts

@@ -15,6 +15,7 @@ const buildStableSplitComponentStatements = template.statements(
   `
     const %%stableComponentIdent%% = import.meta.hot?.data?.[%%hotDataKey%%] ?? %%lazyRouteComponentIdent%%(%%localImporterIdent%%, %%exporterIdent%%)
     if (import.meta.hot) {
+      import.meta.hot.data ??= {}
       import.meta.hot.data[%%hotDataKey%%] = %%stableComponentIdent%%
     }
   `,

packages/router-plugin/tests/add-hmr.test.ts

@@ -68,4 +68,37 @@ describe('add-hmr works', () => {
       },
     )
   })
+
+  it('initializes import.meta.hot.data before storing stable split components', () => {
+    const code = `
+import * as React from 'react'
+import { createFileRoute } from '@tanstack/react-router'
+
+export const Route = createFileRoute('/posts')({
+  component: component,
+})
+
+function component() {
+  return <div>posts</div>
+}
+`
+
+    const compileResult = compileCodeSplitReferenceRoute({
+      code,
+      filename: 'posts.tsx',
+      id: 'posts.tsx',
+      addHmr: true,
+      codeSplitGroupings: defaultCodeSplitGroupings,
+      targetFramework: 'react',
+      compilerPlugins: getReferenceRouteCompilerPlugins({
+        targetFramework: 'react',
+        addHmr: true,
+      }),
+    })
+
+    expect(compileResult?.code).toContain('import.meta.hot.data ??= {}')
+    expect(compileResult?.code).toContain(
+      'import.meta.hot.data["tsr-split-component:component"] = TSRSplitComponent',
+    )
+  })
 })

packages/router-plugin/tests/add-hmr/snapshots/react/arrow-function@true.tsx

@@ -5,6 +5,7 @@ import { createFileRoute } from '@tanstack/react-router';
 import { fetchPosts } from '../posts';
 const TSRSplitComponent = import.meta.hot?.data?.["tsr-split-component:component"] ?? lazyRouteComponent($$splitComponentImporter, "component");
 if (import.meta.hot) {
+  import.meta.hot.data ??= {};
   import.meta.hot.data["tsr-split-component:component"] = TSRSplitComponent;
 }
 export const Route = createFileRoute('/posts')({

packages/router-plugin/tests/add-hmr/snapshots/react/function-declaration@true.tsx

@@ -5,6 +5,7 @@ import { createFileRoute } from '@tanstack/react-router';
 import { fetchPosts } from '../posts';
 const TSRSplitComponent = import.meta.hot?.data?.["tsr-split-component:component"] ?? lazyRouteComponent($$splitComponentImporter, "component");
 if (import.meta.hot) {
+  import.meta.hot.data ??= {};
   import.meta.hot.data["tsr-split-component:component"] = TSRSplitComponent;
 }
 export const Route = createFileRoute('/posts')({

packages/router-plugin/tests/add-hmr/snapshots/react/multi-component@true.tsx

@@ -6,10 +6,12 @@ import { createFileRoute } from '@tanstack/react-router';
 import { fetchPosts } from '../posts';
 const TSRSplitComponent = import.meta.hot?.data?.["tsr-split-component:component"] ?? lazyRouteComponent($$splitComponentImporter, "component");
 if (import.meta.hot) {
+  import.meta.hot.data ??= {};
   import.meta.hot.data["tsr-split-component:component"] = TSRSplitComponent;
 }
 const TSRSplitErrorComponent = import.meta.hot?.data?.["tsr-split-component:errorComponent"] ?? lazyRouteComponent($$splitErrorComponentImporter, "errorComponent");
 if (import.meta.hot) {
+  import.meta.hot.data ??= {};
   import.meta.hot.data["tsr-split-component:errorComponent"] = TSRSplitErrorComponent;
 }
 export const Route = createFileRoute('/posts')({

packages/router-plugin/tests/add-hmr/snapshots/react/string-literal-keys@true.tsx

@@ -6,10 +6,12 @@ import { createFileRoute } from '@tanstack/react-router';
 import { fetchPosts } from '../posts';
 const TSRSplitComponent = import.meta.hot?.data?.["tsr-split-component:component"] ?? lazyRouteComponent($$splitComponentImporter, "component");
 if (import.meta.hot) {
+  import.meta.hot.data ??= {};
   import.meta.hot.data["tsr-split-component:component"] = TSRSplitComponent;
 }
 const TSRSplitErrorComponent = import.meta.hot?.data?.["tsr-split-component:errorComponent"] ?? lazyRouteComponent($$splitErrorComponentImporter, "errorComponent");
 if (import.meta.hot) {
+  import.meta.hot.data ??= {};
   import.meta.hot.data["tsr-split-component:errorComponent"] = TSRSplitErrorComponent;
 }
 export const Route = createFileRoute('/posts')({