+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ Writing your data fetching logic by hand is over. Tell TanStack
+ Query where to get your data and how fresh you need it to be and
+ the rest is automatic. It handles{' '}
+
+ caching, background updates and stale data out of the box with
+ zero-configuration
+
+ .
+
+
+
+
+
+
+
+
+
+ Simple & Familiar
+
+
+ If you know how to work with promises or async/await, then you
+ already know how to use TanStack Query. There's{' '}
+
+ no global state to manage, reducers, normalization systems or
+ heavy configurations to understand
+
+ . Simply pass a function that resolves your data (or throws an
+ error) and the rest is history.
+
+
+
+
+
+
+
+
+
+ Extensible
+
+
+ TanStack Query is configurable down to each observer instance of a
+ query with knobs and options to fit every use-case. It comes wired
+ up with{' '}
+
+ dedicated devtools, infinite-loading APIs, and first class
+ mutation tools that make updating your data a breeze
+
+ . Don't worry though, everything is pre-configured for success!
+
+
+
+
*/}
+
+ {/*
+
+
+ No dependencies. All the Features.
+
+
+ With zero dependencies, TanStack Query is extremely lean given the
+ dense feature set it provides. From weekend hobbies all the way to
+ enterprise e-commerce systems (Yes, I'm lookin' at you Walmart! 😉),
+ TanStack Query is the battle-hardened tool to help you succeed at
+ the speed of your creativity.
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+
+ This ad helps us be happy about our invested time and not burn out and
+ rage-quit OSS. Yay money! 😉
+
+
+
+ {/*
+
+
+ Less code, fewer edge cases.
+
+
+ Instead of writing reducers, caching logic, timers, retry logic,
+ complex async/await scripting (I could keep going...), you literally
+ write a tiny fraction of the code you normally would. You will be
+ surprised at how little code you're writing or how much code you're
+ deleting when you use TanStack Query. Try it out with one of the
+ examples below!
+
+ Looking for the @tanstack/{framework}-query{' '}
+ example? We could use your help to build the{' '}
+ @tanstack/{framework}-query adapter! Join the{' '}
+
+ TanStack Discord Server
+ {' '}
+ and let's get to work!
+
+
+ ) : (
+
+
+
+ )} */}
+
+ {/*
+
+ Wow, you've come a long way!
+
+
+ Only one thing left to do...
+
+
+
+ Read the Docs!
+
+
+
*/}
+
+
;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/1-default/development/useStateDestructure@notFoundComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/1-default/development/useStateDestructure@notFoundComponent.tsx
new file mode 100644
index 0000000000..2c2aba5396
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/1-default/development/useStateDestructure@notFoundComponent.tsx
@@ -0,0 +1,444 @@
+import * as React from 'react';
+import { CgCornerUpLeft, CgSpinner } from 'react-icons/cg';
+import { FaDiscord, FaGithub, FaTshirt, FaTwitter } from 'react-icons/fa';
+import { Await, Link, getRouteApi } from '@tanstack/react-router';
+import { Carbon } from '~/components/Carbon';
+import { Footer } from '~/components/Footer';
+import { TbHeartHandshake } from 'react-icons/tb';
+import SponsorPack from '~/components/SponsorPack';
+import { startProject } from '~/projects/start';
+const menu = [{
+ label:
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ Writing your data fetching logic by hand is over. Tell TanStack
+ Query where to get your data and how fresh you need it to be and
+ the rest is automatic. It handles{' '}
+
+ caching, background updates and stale data out of the box with
+ zero-configuration
+
+ .
+
+
+
+
+
+
+
+
+
+ Simple & Familiar
+
+
+ If you know how to work with promises or async/await, then you
+ already know how to use TanStack Query. There's{' '}
+
+ no global state to manage, reducers, normalization systems or
+ heavy configurations to understand
+
+ . Simply pass a function that resolves your data (or throws an
+ error) and the rest is history.
+
+
+
+
+
+
+
+
+
+ Extensible
+
+
+ TanStack Query is configurable down to each observer instance of a
+ query with knobs and options to fit every use-case. It comes wired
+ up with{' '}
+
+ dedicated devtools, infinite-loading APIs, and first class
+ mutation tools that make updating your data a breeze
+
+ . Don't worry though, everything is pre-configured for success!
+
+
+
+
*/}
+
+ {/*
+
+
+ No dependencies. All the Features.
+
+
+ With zero dependencies, TanStack Query is extremely lean given the
+ dense feature set it provides. From weekend hobbies all the way to
+ enterprise e-commerce systems (Yes, I'm lookin' at you Walmart! 😉),
+ TanStack Query is the battle-hardened tool to help you succeed at
+ the speed of your creativity.
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+
+ This ad helps us be happy about our invested time and not burn out and
+ rage-quit OSS. Yay money! 😉
+
+
+
+ {/*
+
+
+ Less code, fewer edge cases.
+
+
+ Instead of writing reducers, caching logic, timers, retry logic,
+ complex async/await scripting (I could keep going...), you literally
+ write a tiny fraction of the code you normally would. You will be
+ surprised at how little code you're writing or how much code you're
+ deleting when you use TanStack Query. Try it out with one of the
+ examples below!
+
+ Looking for the @tanstack/{framework}-query{' '}
+ example? We could use your help to build the{' '}
+ @tanstack/{framework}-query adapter! Join the{' '}
+
+ TanStack Discord Server
+ {' '}
+ and let's get to work!
+
+
+ ) : (
+
+
+
+ )} */}
+
+ {/*
+
+ Wow, you've come a long way!
+
+
+ Only one thing left to do...
+
+
+
+ Read the Docs!
+
+
+
*/}
+
+
;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/1-default/development/useStateDestructure@pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/1-default/development/useStateDestructure@pendingComponent.tsx
new file mode 100644
index 0000000000..2c2aba5396
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/1-default/development/useStateDestructure@pendingComponent.tsx
@@ -0,0 +1,444 @@
+import * as React from 'react';
+import { CgCornerUpLeft, CgSpinner } from 'react-icons/cg';
+import { FaDiscord, FaGithub, FaTshirt, FaTwitter } from 'react-icons/fa';
+import { Await, Link, getRouteApi } from '@tanstack/react-router';
+import { Carbon } from '~/components/Carbon';
+import { Footer } from '~/components/Footer';
+import { TbHeartHandshake } from 'react-icons/tb';
+import SponsorPack from '~/components/SponsorPack';
+import { startProject } from '~/projects/start';
+const menu = [{
+ label:
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ Writing your data fetching logic by hand is over. Tell TanStack
+ Query where to get your data and how fresh you need it to be and
+ the rest is automatic. It handles{' '}
+
+ caching, background updates and stale data out of the box with
+ zero-configuration
+
+ .
+
+
+
+
+
+
+
+
+
+ Simple & Familiar
+
+
+ If you know how to work with promises or async/await, then you
+ already know how to use TanStack Query. There's{' '}
+
+ no global state to manage, reducers, normalization systems or
+ heavy configurations to understand
+
+ . Simply pass a function that resolves your data (or throws an
+ error) and the rest is history.
+
+
+
+
+
+
+
+
+
+ Extensible
+
+
+ TanStack Query is configurable down to each observer instance of a
+ query with knobs and options to fit every use-case. It comes wired
+ up with{' '}
+
+ dedicated devtools, infinite-loading APIs, and first class
+ mutation tools that make updating your data a breeze
+
+ . Don't worry though, everything is pre-configured for success!
+
+
+
+
*/}
+
+ {/*
+
+
+ No dependencies. All the Features.
+
+
+ With zero dependencies, TanStack Query is extremely lean given the
+ dense feature set it provides. From weekend hobbies all the way to
+ enterprise e-commerce systems (Yes, I'm lookin' at you Walmart! 😉),
+ TanStack Query is the battle-hardened tool to help you succeed at
+ the speed of your creativity.
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+
+ This ad helps us be happy about our invested time and not burn out and
+ rage-quit OSS. Yay money! 😉
+
+
+
+ {/*
+
+
+ Less code, fewer edge cases.
+
+
+ Instead of writing reducers, caching logic, timers, retry logic,
+ complex async/await scripting (I could keep going...), you literally
+ write a tiny fraction of the code you normally would. You will be
+ surprised at how little code you're writing or how much code you're
+ deleting when you use TanStack Query. Try it out with one of the
+ examples below!
+
+ Looking for the @tanstack/{framework}-query{' '}
+ example? We could use your help to build the{' '}
+ @tanstack/{framework}-query adapter! Join the{' '}
+
+ TanStack Discord Server
+ {' '}
+ and let's get to work!
+
+
+ ) : (
+
+
+
+ )} */}
+
+ {/*
+
+ Wow, you've come a long way!
+
+
+ Only one thing left to do...
+
+
+
+ Read the Docs!
+
+
+
*/}
+
+
;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/1-default/production/arrow-function.tsx b/packages/router-plugin/tests/code-splitter/snapshots/1-default/production/arrow-function.tsx
new file mode 100644
index 0000000000..6b2e1dcace
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/1-default/production/arrow-function.tsx
@@ -0,0 +1,8 @@
+const $$splitComponentImporter = () => import('arrow-function.tsx?tsr-split=component');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+import { fetchPosts } from '../posts';
+export const Route = createFileRoute('/posts')({
+ loader: fetchPosts,
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/1-default/production/arrow-function@component.tsx b/packages/router-plugin/tests/code-splitter/snapshots/1-default/production/arrow-function@component.tsx
new file mode 100644
index 0000000000..be5c0086de
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/1-default/production/arrow-function@component.tsx
@@ -0,0 +1,26 @@
+import { Link, Outlet } from '@tanstack/react-router';
+import { Route } from "arrow-function.tsx";
+const SplitComponent = () => {
+ const posts = Route.useLoaderData();
+ return
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ Writing your data fetching logic by hand is over. Tell TanStack
+ Query where to get your data and how fresh you need it to be and
+ the rest is automatic. It handles{' '}
+
+ caching, background updates and stale data out of the box with
+ zero-configuration
+
+ .
+
+
+
+
+
+
+
+
+
+ Simple & Familiar
+
+
+ If you know how to work with promises or async/await, then you
+ already know how to use TanStack Query. There's{' '}
+
+ no global state to manage, reducers, normalization systems or
+ heavy configurations to understand
+
+ . Simply pass a function that resolves your data (or throws an
+ error) and the rest is history.
+
+
+
+
+
+
+
+
+
+ Extensible
+
+
+ TanStack Query is configurable down to each observer instance of a
+ query with knobs and options to fit every use-case. It comes wired
+ up with{' '}
+
+ dedicated devtools, infinite-loading APIs, and first class
+ mutation tools that make updating your data a breeze
+
+ . Don't worry though, everything is pre-configured for success!
+
+
+
+
*/}
+
+ {/*
+
+
+ No dependencies. All the Features.
+
+
+ With zero dependencies, TanStack Query is extremely lean given the
+ dense feature set it provides. From weekend hobbies all the way to
+ enterprise e-commerce systems (Yes, I'm lookin' at you Walmart! 😉),
+ TanStack Query is the battle-hardened tool to help you succeed at
+ the speed of your creativity.
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+
+ This ad helps us be happy about our invested time and not burn out and
+ rage-quit OSS. Yay money! 😉
+
+
+
+ {/*
+
+
+ Less code, fewer edge cases.
+
+
+ Instead of writing reducers, caching logic, timers, retry logic,
+ complex async/await scripting (I could keep going...), you literally
+ write a tiny fraction of the code you normally would. You will be
+ surprised at how little code you're writing or how much code you're
+ deleting when you use TanStack Query. Try it out with one of the
+ examples below!
+
+ Looking for the @tanstack/{framework}-query{' '}
+ example? We could use your help to build the{' '}
+ @tanstack/{framework}-query adapter! Join the{' '}
+
+ TanStack Discord Server
+ {' '}
+ and let's get to work!
+
+
+ ) : (
+
+
+
+ )} */}
+
+ {/*
+
+ Wow, you've come a long way!
+
+
+ Only one thing left to do...
+
+
+
+ Read the Docs!
+
+
+
*/}
+
+
;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/1-default/production/useStateDestructure@notFoundComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/1-default/production/useStateDestructure@notFoundComponent.tsx
new file mode 100644
index 0000000000..2c2aba5396
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/1-default/production/useStateDestructure@notFoundComponent.tsx
@@ -0,0 +1,444 @@
+import * as React from 'react';
+import { CgCornerUpLeft, CgSpinner } from 'react-icons/cg';
+import { FaDiscord, FaGithub, FaTshirt, FaTwitter } from 'react-icons/fa';
+import { Await, Link, getRouteApi } from '@tanstack/react-router';
+import { Carbon } from '~/components/Carbon';
+import { Footer } from '~/components/Footer';
+import { TbHeartHandshake } from 'react-icons/tb';
+import SponsorPack from '~/components/SponsorPack';
+import { startProject } from '~/projects/start';
+const menu = [{
+ label:
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ Writing your data fetching logic by hand is over. Tell TanStack
+ Query where to get your data and how fresh you need it to be and
+ the rest is automatic. It handles{' '}
+
+ caching, background updates and stale data out of the box with
+ zero-configuration
+
+ .
+
+
+
+
+
+
+
+
+
+ Simple & Familiar
+
+
+ If you know how to work with promises or async/await, then you
+ already know how to use TanStack Query. There's{' '}
+
+ no global state to manage, reducers, normalization systems or
+ heavy configurations to understand
+
+ . Simply pass a function that resolves your data (or throws an
+ error) and the rest is history.
+
+
+
+
+
+
+
+
+
+ Extensible
+
+
+ TanStack Query is configurable down to each observer instance of a
+ query with knobs and options to fit every use-case. It comes wired
+ up with{' '}
+
+ dedicated devtools, infinite-loading APIs, and first class
+ mutation tools that make updating your data a breeze
+
+ . Don't worry though, everything is pre-configured for success!
+
+
+
+
*/}
+
+ {/*
+
+
+ No dependencies. All the Features.
+
+
+ With zero dependencies, TanStack Query is extremely lean given the
+ dense feature set it provides. From weekend hobbies all the way to
+ enterprise e-commerce systems (Yes, I'm lookin' at you Walmart! 😉),
+ TanStack Query is the battle-hardened tool to help you succeed at
+ the speed of your creativity.
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+
+ This ad helps us be happy about our invested time and not burn out and
+ rage-quit OSS. Yay money! 😉
+
+
+
+ {/*
+
+
+ Less code, fewer edge cases.
+
+
+ Instead of writing reducers, caching logic, timers, retry logic,
+ complex async/await scripting (I could keep going...), you literally
+ write a tiny fraction of the code you normally would. You will be
+ surprised at how little code you're writing or how much code you're
+ deleting when you use TanStack Query. Try it out with one of the
+ examples below!
+
+ Looking for the @tanstack/{framework}-query{' '}
+ example? We could use your help to build the{' '}
+ @tanstack/{framework}-query adapter! Join the{' '}
+
+ TanStack Discord Server
+ {' '}
+ and let's get to work!
+
+
+ ) : (
+
+
+
+ )} */}
+
+ {/*
+
+ Wow, you've come a long way!
+
+
+ Only one thing left to do...
+
+
+
+ Read the Docs!
+
+
+
*/}
+
+
;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/1-default/production/useStateDestructure@pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/1-default/production/useStateDestructure@pendingComponent.tsx
new file mode 100644
index 0000000000..2c2aba5396
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/1-default/production/useStateDestructure@pendingComponent.tsx
@@ -0,0 +1,444 @@
+import * as React from 'react';
+import { CgCornerUpLeft, CgSpinner } from 'react-icons/cg';
+import { FaDiscord, FaGithub, FaTshirt, FaTwitter } from 'react-icons/fa';
+import { Await, Link, getRouteApi } from '@tanstack/react-router';
+import { Carbon } from '~/components/Carbon';
+import { Footer } from '~/components/Footer';
+import { TbHeartHandshake } from 'react-icons/tb';
+import SponsorPack from '~/components/SponsorPack';
+import { startProject } from '~/projects/start';
+const menu = [{
+ label:
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ Writing your data fetching logic by hand is over. Tell TanStack
+ Query where to get your data and how fresh you need it to be and
+ the rest is automatic. It handles{' '}
+
+ caching, background updates and stale data out of the box with
+ zero-configuration
+
+ .
+
+
+
+
+
+
+
+
+
+ Simple & Familiar
+
+
+ If you know how to work with promises or async/await, then you
+ already know how to use TanStack Query. There's{' '}
+
+ no global state to manage, reducers, normalization systems or
+ heavy configurations to understand
+
+ . Simply pass a function that resolves your data (or throws an
+ error) and the rest is history.
+
+
+
+
+
+
+
+
+
+ Extensible
+
+
+ TanStack Query is configurable down to each observer instance of a
+ query with knobs and options to fit every use-case. It comes wired
+ up with{' '}
+
+ dedicated devtools, infinite-loading APIs, and first class
+ mutation tools that make updating your data a breeze
+
+ . Don't worry though, everything is pre-configured for success!
+
+
+
+
*/}
+
+ {/*
+
+
+ No dependencies. All the Features.
+
+
+ With zero dependencies, TanStack Query is extremely lean given the
+ dense feature set it provides. From weekend hobbies all the way to
+ enterprise e-commerce systems (Yes, I'm lookin' at you Walmart! 😉),
+ TanStack Query is the battle-hardened tool to help you succeed at
+ the speed of your creativity.
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+
+ This ad helps us be happy about our invested time and not burn out and
+ rage-quit OSS. Yay money! 😉
+
+
+
+ {/*
+
+
+ Less code, fewer edge cases.
+
+
+ Instead of writing reducers, caching logic, timers, retry logic,
+ complex async/await scripting (I could keep going...), you literally
+ write a tiny fraction of the code you normally would. You will be
+ surprised at how little code you're writing or how much code you're
+ deleting when you use TanStack Query. Try it out with one of the
+ examples below!
+
+ Looking for the @tanstack/{framework}-query{' '}
+ example? We could use your help to build the{' '}
+ @tanstack/{framework}-query adapter! Join the{' '}
+
+ TanStack Discord Server
+ {' '}
+ and let's get to work!
+
+
+ ) : (
+
+
+
+ )} */}
+
+ {/*
+
+ Wow, you've come a long way!
+
+
+ Only one thing left to do...
+
+
+
+ Read the Docs!
+
+
+
*/}
+
+
;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/development/arrow-function.tsx b/packages/router-plugin/tests/code-splitter/snapshots/2-components-combined-loader-separate/development/arrow-function.tsx
similarity index 84%
rename from packages/router-plugin/tests/code-splitter/snapshots/development/arrow-function.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/2-components-combined-loader-separate/development/arrow-function.tsx
index 284e796894..a84401590d 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/development/arrow-function.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/2-components-combined-loader-separate/development/arrow-function.tsx
@@ -1,6 +1,6 @@
-const $$splitComponentImporter = () => import('arrow-function.tsx?tsr-split');
+const $$splitComponentImporter = () => import('arrow-function.tsx?tsr-split=component---errorComponent---notFoundComponent---pendingComponent');
import { lazyRouteComponent } from '@tanstack/react-router';
-const $$splitLoaderImporter = () => import('arrow-function.tsx?tsr-split');
+const $$splitLoaderImporter = () => import('arrow-function.tsx?tsr-split=loader');
import { lazyFn } from '@tanstack/react-router';
import { createFileRoute } from '@tanstack/react-router';
export const Route = createFileRoute('/posts')({
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/2-components-combined-loader-separate/development/arrow-function@component---errorComponent---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/2-components-combined-loader-separate/development/arrow-function@component---errorComponent---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..be5c0086de
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/2-components-combined-loader-separate/development/arrow-function@component---errorComponent---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,26 @@
+import { Link, Outlet } from '@tanstack/react-router';
+import { Route } from "arrow-function.tsx";
+const SplitComponent = () => {
+ const posts = Route.useLoaderData();
+ return
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ Writing your data fetching logic by hand is over. Tell TanStack
+ Query where to get your data and how fresh you need it to be and
+ the rest is automatic. It handles{' '}
+
+ caching, background updates and stale data out of the box with
+ zero-configuration
+
+ .
+
+
+
+
+
+
+
+
+
+ Simple & Familiar
+
+
+ If you know how to work with promises or async/await, then you
+ already know how to use TanStack Query. There's{' '}
+
+ no global state to manage, reducers, normalization systems or
+ heavy configurations to understand
+
+ . Simply pass a function that resolves your data (or throws an
+ error) and the rest is history.
+
+
+
+
+
+
+
+
+
+ Extensible
+
+
+ TanStack Query is configurable down to each observer instance of a
+ query with knobs and options to fit every use-case. It comes wired
+ up with{' '}
+
+ dedicated devtools, infinite-loading APIs, and first class
+ mutation tools that make updating your data a breeze
+
+ . Don't worry though, everything is pre-configured for success!
+
+
+
+
*/}
+
+ {/*
+
+
+ No dependencies. All the Features.
+
+
+ With zero dependencies, TanStack Query is extremely lean given the
+ dense feature set it provides. From weekend hobbies all the way to
+ enterprise e-commerce systems (Yes, I'm lookin' at you Walmart! 😉),
+ TanStack Query is the battle-hardened tool to help you succeed at
+ the speed of your creativity.
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+
+ This ad helps us be happy about our invested time and not burn out and
+ rage-quit OSS. Yay money! 😉
+
+
+
+ {/*
+
+
+ Less code, fewer edge cases.
+
+
+ Instead of writing reducers, caching logic, timers, retry logic,
+ complex async/await scripting (I could keep going...), you literally
+ write a tiny fraction of the code you normally would. You will be
+ surprised at how little code you're writing or how much code you're
+ deleting when you use TanStack Query. Try it out with one of the
+ examples below!
+
+ Looking for the @tanstack/{framework}-query{' '}
+ example? We could use your help to build the{' '}
+ @tanstack/{framework}-query adapter! Join the{' '}
+
+ TanStack Discord Server
+ {' '}
+ and let's get to work!
+
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ Writing your data fetching logic by hand is over. Tell TanStack
+ Query where to get your data and how fresh you need it to be and
+ the rest is automatic. It handles{' '}
+
+ caching, background updates and stale data out of the box with
+ zero-configuration
+
+ .
+
+
+
+
+
+
+
+
+
+ Simple & Familiar
+
+
+ If you know how to work with promises or async/await, then you
+ already know how to use TanStack Query. There's{' '}
+
+ no global state to manage, reducers, normalization systems or
+ heavy configurations to understand
+
+ . Simply pass a function that resolves your data (or throws an
+ error) and the rest is history.
+
+
+
+
+
+
+
+
+
+ Extensible
+
+
+ TanStack Query is configurable down to each observer instance of a
+ query with knobs and options to fit every use-case. It comes wired
+ up with{' '}
+
+ dedicated devtools, infinite-loading APIs, and first class
+ mutation tools that make updating your data a breeze
+
+ . Don't worry though, everything is pre-configured for success!
+
+
+
+
*/}
+
+ {/*
+
+
+ No dependencies. All the Features.
+
+
+ With zero dependencies, TanStack Query is extremely lean given the
+ dense feature set it provides. From weekend hobbies all the way to
+ enterprise e-commerce systems (Yes, I'm lookin' at you Walmart! 😉),
+ TanStack Query is the battle-hardened tool to help you succeed at
+ the speed of your creativity.
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+
+ This ad helps us be happy about our invested time and not burn out and
+ rage-quit OSS. Yay money! 😉
+
+
+
+ {/*
+
+
+ Less code, fewer edge cases.
+
+
+ Instead of writing reducers, caching logic, timers, retry logic,
+ complex async/await scripting (I could keep going...), you literally
+ write a tiny fraction of the code you normally would. You will be
+ surprised at how little code you're writing or how much code you're
+ deleting when you use TanStack Query. Try it out with one of the
+ examples below!
+
+ Looking for the @tanstack/{framework}-query{' '}
+ example? We could use your help to build the{' '}
+ @tanstack/{framework}-query adapter! Join the{' '}
+
+ TanStack Discord Server
+ {' '}
+ and let's get to work!
+
+
+ ) : (
+
+
+
+ )} */}
+
+ {/*
+
+ Wow, you've come a long way!
+
+
+ Only one thing left to do...
+
+
+
+ Read the Docs!
+
+
+
*/}
+
+
;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/production/arrow-function.tsx b/packages/router-plugin/tests/code-splitter/snapshots/2-components-combined-loader-separate/production/arrow-function.tsx
similarity index 82%
rename from packages/router-plugin/tests/code-splitter/snapshots/production/arrow-function.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/2-components-combined-loader-separate/production/arrow-function.tsx
index 1b49b7ff9a..0a7cee7f7a 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/production/arrow-function.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/2-components-combined-loader-separate/production/arrow-function.tsx
@@ -1,6 +1,6 @@
-const $$splitComponentImporter = () => import('arrow-function.tsx?tsr-split');
+const $$splitComponentImporter = () => import('arrow-function.tsx?tsr-split=component---errorComponent---notFoundComponent---pendingComponent');
import { lazyRouteComponent } from '@tanstack/react-router';
-const $$splitLoaderImporter = () => import('arrow-function.tsx?tsr-split');
+const $$splitLoaderImporter = () => import('arrow-function.tsx?tsr-split=loader');
import { lazyFn } from '@tanstack/react-router';
import { createFileRoute } from '@tanstack/react-router';
export const Route = createFileRoute('/posts')({
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/2-components-combined-loader-separate/production/arrow-function@component---errorComponent---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/2-components-combined-loader-separate/production/arrow-function@component---errorComponent---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..be5c0086de
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/2-components-combined-loader-separate/production/arrow-function@component---errorComponent---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,26 @@
+import { Link, Outlet } from '@tanstack/react-router';
+import { Route } from "arrow-function.tsx";
+const SplitComponent = () => {
+ const posts = Route.useLoaderData();
+ return
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ Writing your data fetching logic by hand is over. Tell TanStack
+ Query where to get your data and how fresh you need it to be and
+ the rest is automatic. It handles{' '}
+
+ caching, background updates and stale data out of the box with
+ zero-configuration
+
+ .
+
+
+
+
+
+
+
+
+
+ Simple & Familiar
+
+
+ If you know how to work with promises or async/await, then you
+ already know how to use TanStack Query. There's{' '}
+
+ no global state to manage, reducers, normalization systems or
+ heavy configurations to understand
+
+ . Simply pass a function that resolves your data (or throws an
+ error) and the rest is history.
+
+
+
+
+
+
+
+
+
+ Extensible
+
+
+ TanStack Query is configurable down to each observer instance of a
+ query with knobs and options to fit every use-case. It comes wired
+ up with{' '}
+
+ dedicated devtools, infinite-loading APIs, and first class
+ mutation tools that make updating your data a breeze
+
+ . Don't worry though, everything is pre-configured for success!
+
+
+
+
*/}
+
+ {/*
+
+
+ No dependencies. All the Features.
+
+
+ With zero dependencies, TanStack Query is extremely lean given the
+ dense feature set it provides. From weekend hobbies all the way to
+ enterprise e-commerce systems (Yes, I'm lookin' at you Walmart! 😉),
+ TanStack Query is the battle-hardened tool to help you succeed at
+ the speed of your creativity.
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+
+ This ad helps us be happy about our invested time and not burn out and
+ rage-quit OSS. Yay money! 😉
+
+
+
+ {/*
+
+
+ Less code, fewer edge cases.
+
+
+ Instead of writing reducers, caching logic, timers, retry logic,
+ complex async/await scripting (I could keep going...), you literally
+ write a tiny fraction of the code you normally would. You will be
+ surprised at how little code you're writing or how much code you're
+ deleting when you use TanStack Query. Try it out with one of the
+ examples below!
+
+ Looking for the @tanstack/{framework}-query{' '}
+ example? We could use your help to build the{' '}
+ @tanstack/{framework}-query adapter! Join the{' '}
+
+ TanStack Discord Server
+ {' '}
+ and let's get to work!
+
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ Writing your data fetching logic by hand is over. Tell TanStack
+ Query where to get your data and how fresh you need it to be and
+ the rest is automatic. It handles{' '}
+
+ caching, background updates and stale data out of the box with
+ zero-configuration
+
+ .
+
+
+
+
+
+
+
+
+
+ Simple & Familiar
+
+
+ If you know how to work with promises or async/await, then you
+ already know how to use TanStack Query. There's{' '}
+
+ no global state to manage, reducers, normalization systems or
+ heavy configurations to understand
+
+ . Simply pass a function that resolves your data (or throws an
+ error) and the rest is history.
+
+
+
+
+
+
+
+
+
+ Extensible
+
+
+ TanStack Query is configurable down to each observer instance of a
+ query with knobs and options to fit every use-case. It comes wired
+ up with{' '}
+
+ dedicated devtools, infinite-loading APIs, and first class
+ mutation tools that make updating your data a breeze
+
+ . Don't worry though, everything is pre-configured for success!
+
+
+
+
*/}
+
+ {/*
+
+
+ No dependencies. All the Features.
+
+
+ With zero dependencies, TanStack Query is extremely lean given the
+ dense feature set it provides. From weekend hobbies all the way to
+ enterprise e-commerce systems (Yes, I'm lookin' at you Walmart! 😉),
+ TanStack Query is the battle-hardened tool to help you succeed at
+ the speed of your creativity.
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+
+ This ad helps us be happy about our invested time and not burn out and
+ rage-quit OSS. Yay money! 😉
+
+
+
+ {/*
+
+
+ Less code, fewer edge cases.
+
+
+ Instead of writing reducers, caching logic, timers, retry logic,
+ complex async/await scripting (I could keep going...), you literally
+ write a tiny fraction of the code you normally would. You will be
+ surprised at how little code you're writing or how much code you're
+ deleting when you use TanStack Query. Try it out with one of the
+ examples below!
+
+ Looking for the @tanstack/{framework}-query{' '}
+ example? We could use your help to build the{' '}
+ @tanstack/{framework}-query adapter! Join the{' '}
+
+ TanStack Discord Server
+ {' '}
+ and let's get to work!
+
+
+ ) : (
+
+
+
+ )} */}
+
+ {/*
+
+ Wow, you've come a long way!
+
+
+ Only one thing left to do...
+
+
+
+ Read the Docs!
+
+
+
*/}
+
+
;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/arrow-function.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/arrow-function.tsx
new file mode 100644
index 0000000000..e55be6765d
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/arrow-function.tsx
@@ -0,0 +1,12 @@
+const $$splitComponentImporter = () => import('arrow-function.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+const $$splitLoaderImporter = () => import('arrow-function.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/posts')({
+ loader: lazyFn($$splitLoaderImporter, 'loader'),
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/development/arrow-function@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/arrow-function@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 92%
rename from packages/router-plugin/tests/code-splitter/snapshots/development/arrow-function@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/arrow-function@component---loader---notFoundComponent---pendingComponent.tsx
index 620b059230..7dd37cda89 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/development/arrow-function@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/arrow-function@component---loader---notFoundComponent---pendingComponent.tsx
@@ -1,6 +1,8 @@
import { Link, Outlet } from '@tanstack/react-router';
import { fetchPosts } from '../posts';
import { Route } from "arrow-function.tsx";
+const SplitLoader = fetchPosts;
+export { SplitLoader as loader };
const SplitComponent = () => {
const posts = Route.useLoaderData();
return
@@ -24,6 +26,4 @@ const SplitComponent = () => {
;
};
-export { SplitComponent as component };
-const SplitLoader = fetchPosts;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/arrow-function@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/arrow-function@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/chinese.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/chinese.tsx
new file mode 100644
index 0000000000..c065d14a4a
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/chinese.tsx
@@ -0,0 +1,12 @@
+const $$splitComponentImporter = () => import('chinese.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
+interface DemoProps {
+ title: string;
+}
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/chinese@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/chinese@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..6e6df2f4eb
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/chinese@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,22 @@
+interface DemoProps {
+ title: string;
+}
+function Demo({
+ title
+}: DemoProps) {
+ return
+ {title}
+
;
+}
+const SplitComponent = function HomeComponent() {
+ return
+
+
+
;
+};
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/chinese@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/chinese@errorComponent.tsx
new file mode 100644
index 0000000000..f5392fada0
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/chinese@errorComponent.tsx
@@ -0,0 +1,3 @@
+interface DemoProps {
+ title: string;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/conditional-properties.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/conditional-properties.tsx
new file mode 100644
index 0000000000..279773de15
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/conditional-properties.tsx
@@ -0,0 +1,12 @@
+const $$splitLoaderImporter = () => import('conditional-properties.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+const $$splitComponentImporter = () => import('conditional-properties.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/posts')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ loader: lazyFn($$splitLoaderImporter, 'loader')
+});
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/development/conditional-properties@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/conditional-properties@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 81%
rename from packages/router-plugin/tests/code-splitter/snapshots/development/conditional-properties@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/conditional-properties@component---loader---notFoundComponent---pendingComponent.tsx
index d483dd047c..857b130de7 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/development/conditional-properties@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/conditional-properties@component---loader---notFoundComponent---pendingComponent.tsx
@@ -1,7 +1,7 @@
import { isEnabled } from '@features/feature-flags';
import TrueImport from '@modules/true-component';
import { FalseComponent, falseLoader } from '@modules/false-component';
-const SplitComponent = isEnabled ? TrueImport.Component : FalseComponent;
-export { SplitComponent as component };
const SplitLoader = isEnabled ? TrueImport.loader : falseLoader;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitLoader as loader };
+const SplitComponent = isEnabled ? TrueImport.Component : FalseComponent;
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/conditional-properties@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/conditional-properties@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructured-react-memo-imported-component.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructured-react-memo-imported-component.tsx
new file mode 100644
index 0000000000..0fe0b8418d
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructured-react-memo-imported-component.tsx
@@ -0,0 +1,12 @@
+const $$splitLoaderImporter = () => import('destructured-react-memo-imported-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+const $$splitComponentImporter = () => import('destructured-react-memo-imported-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ loader: lazyFn($$splitLoaderImporter, 'loader')
+});
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/development/destructured-react-memo-imported-component@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructured-react-memo-imported-component@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 74%
rename from packages/router-plugin/tests/code-splitter/snapshots/development/destructured-react-memo-imported-component@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructured-react-memo-imported-component@component---loader---notFoundComponent---pendingComponent.tsx
index 5d248932f2..b6748bb51b 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/development/destructured-react-memo-imported-component@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructured-react-memo-imported-component@component---loader---notFoundComponent---pendingComponent.tsx
@@ -3,7 +3,7 @@ import { importedLoader } from '../shared/imported';
function Component() {
return
Component
;
}
-const SplitComponent = memo(Component);
-export { SplitComponent as component };
const SplitLoader = importedLoader;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitLoader as loader };
+const SplitComponent = memo(Component);
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructured-react-memo-imported-component@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructured-react-memo-imported-component@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructuring.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructuring.tsx
new file mode 100644
index 0000000000..858c5c0e05
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructuring.tsx
@@ -0,0 +1,11 @@
+import thing from 'thing';
+export function test() {
+ const {
+ foo: {
+ bar: {
+ destructured
+ }
+ }
+ } = thing;
+ return destructured;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructuring@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructuring@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..858c5c0e05
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructuring@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,11 @@
+import thing from 'thing';
+export function test() {
+ const {
+ foo: {
+ bar: {
+ destructured
+ }
+ }
+ } = thing;
+ return destructured;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructuring@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructuring@errorComponent.tsx
new file mode 100644
index 0000000000..858c5c0e05
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/destructuring@errorComponent.tsx
@@ -0,0 +1,11 @@
+import thing from 'thing';
+export function test() {
+ const {
+ foo: {
+ bar: {
+ destructured
+ }
+ }
+ } = thing;
+ return destructured;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-as-parameter.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-as-parameter.tsx
new file mode 100644
index 0000000000..34b469f860
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-as-parameter.tsx
@@ -0,0 +1,19 @@
+import * as React from 'react';
+// @ts-expect-error
+import { useMemo } from 'tan-react';
+const ReactUseMemoCall1 = React.useMemo(function performAction() {
+ return 'true';
+}, []);
+console.info(ReactUseMemoCall1);
+const ReactUseMemoCall2 = React.useMemo(() => {
+ return 'true';
+}, []);
+console.info(ReactUseMemoCall2);
+const UseMemoCall1 = useMemo(function performAction() {
+ return 'true';
+}, []);
+console.info(UseMemoCall1);
+const UseMemoCall2 = useMemo(() => {
+ return 'true';
+}, []);
+console.info(UseMemoCall2);
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-as-parameter@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-as-parameter@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..34b469f860
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-as-parameter@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,19 @@
+import * as React from 'react';
+// @ts-expect-error
+import { useMemo } from 'tan-react';
+const ReactUseMemoCall1 = React.useMemo(function performAction() {
+ return 'true';
+}, []);
+console.info(ReactUseMemoCall1);
+const ReactUseMemoCall2 = React.useMemo(() => {
+ return 'true';
+}, []);
+console.info(ReactUseMemoCall2);
+const UseMemoCall1 = useMemo(function performAction() {
+ return 'true';
+}, []);
+console.info(UseMemoCall1);
+const UseMemoCall2 = useMemo(() => {
+ return 'true';
+}, []);
+console.info(UseMemoCall2);
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-as-parameter@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-as-parameter@errorComponent.tsx
new file mode 100644
index 0000000000..34b469f860
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-as-parameter@errorComponent.tsx
@@ -0,0 +1,19 @@
+import * as React from 'react';
+// @ts-expect-error
+import { useMemo } from 'tan-react';
+const ReactUseMemoCall1 = React.useMemo(function performAction() {
+ return 'true';
+}, []);
+console.info(ReactUseMemoCall1);
+const ReactUseMemoCall2 = React.useMemo(() => {
+ return 'true';
+}, []);
+console.info(ReactUseMemoCall2);
+const UseMemoCall1 = useMemo(function performAction() {
+ return 'true';
+}, []);
+console.info(UseMemoCall1);
+const UseMemoCall2 = useMemo(() => {
+ return 'true';
+}, []);
+console.info(UseMemoCall2);
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-declaration.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-declaration.tsx
new file mode 100644
index 0000000000..dda89e55de
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-declaration.tsx
@@ -0,0 +1,12 @@
+const $$splitComponentImporter = () => import('function-declaration.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+const $$splitLoaderImporter = () => import('function-declaration.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/posts')({
+ loader: lazyFn($$splitLoaderImporter, 'loader'),
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/development/function-declaration@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-declaration@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 92%
rename from packages/router-plugin/tests/code-splitter/snapshots/development/function-declaration@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-declaration@component---loader---notFoundComponent---pendingComponent.tsx
index 7ecd525a8b..6eadf0e795 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/development/function-declaration@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-declaration@component---loader---notFoundComponent---pendingComponent.tsx
@@ -1,6 +1,8 @@
import { Link, Outlet } from '@tanstack/react-router';
import { fetchPosts } from '../posts';
import { Route } from "function-declaration.tsx";
+const SplitLoader = fetchPosts;
+export { SplitLoader as loader };
const SplitComponent = function PostsComponent() {
const posts = Route.useLoaderData();
return
@@ -24,6 +26,4 @@ const SplitComponent = function PostsComponent() {
;
};
-export { SplitComponent as component };
-const SplitLoader = fetchPosts;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-declaration@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/function-declaration@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/importAttribute.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/importAttribute.tsx
new file mode 100644
index 0000000000..d8355986bf
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/importAttribute.tsx
@@ -0,0 +1,9 @@
+const $$splitComponentImporter = () => import('importAttribute.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/importAttribute@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/importAttribute@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..f34d3c6408
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/importAttribute@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,3 @@
+import { test } from './test' with { type: 'macro' };
+const SplitComponent = () => test;
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/importAttribute@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/importAttribute@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component-destructured-loader.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component-destructured-loader.tsx
new file mode 100644
index 0000000000..4e0beddab5
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component-destructured-loader.tsx
@@ -0,0 +1,12 @@
+const $$splitLoaderImporter = () => import('imported-default-component-destructured-loader.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+const $$splitComponentImporter = () => import('imported-default-component-destructured-loader.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ loader: lazyFn($$splitLoaderImporter, 'loader')
+});
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/production/imported-default-component-destructured-loader@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component-destructured-loader@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 67%
rename from packages/router-plugin/tests/code-splitter/snapshots/production/imported-default-component-destructured-loader@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component-destructured-loader@component---loader---notFoundComponent---pendingComponent.tsx
index 36b0a4fd34..7ca09fd5d7 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/production/imported-default-component-destructured-loader@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component-destructured-loader@component---loader---notFoundComponent---pendingComponent.tsx
@@ -1,5 +1,5 @@
import importedComponent, { importedLoader } from '../shared/imported';
-const SplitComponent = importedComponent;
-export { SplitComponent as component };
const SplitLoader = importedLoader;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitLoader as loader };
+const SplitComponent = importedComponent;
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component-destructured-loader@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component-destructured-loader@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component.tsx
new file mode 100644
index 0000000000..b749bed2ea
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component.tsx
@@ -0,0 +1,9 @@
+const $$splitComponentImporter = () => import('imported-default-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..c52d2691b4
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,3 @@
+import ImportedDefaultComponent from '../shared/imported';
+const SplitComponent = ImportedDefaultComponent;
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-default-component@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-errorComponent.tsx
new file mode 100644
index 0000000000..26951c2d0a
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-errorComponent.tsx
@@ -0,0 +1,11 @@
+const $$splitErrorComponentImporter = () => import('imported-errorComponent.tsx?tsr-split=errorComponent');
+const $$splitComponentImporter = () => import('imported-errorComponent.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ errorComponent: lazyRouteComponent($$splitErrorComponentImporter, 'errorComponent')
+});
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-errorComponent@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-errorComponent@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..c52d2691b4
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-errorComponent@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,3 @@
+import ImportedDefaultComponent from '../shared/imported';
+const SplitComponent = ImportedDefaultComponent;
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-errorComponent@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-errorComponent@errorComponent.tsx
new file mode 100644
index 0000000000..1d7f487fd2
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-errorComponent@errorComponent.tsx
@@ -0,0 +1,3 @@
+import { importedErrorComponent } from '../shared/imported';
+const SplitErrorComponent = importedErrorComponent;
+export { SplitErrorComponent as errorComponent };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-notFoundComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-notFoundComponent.tsx
new file mode 100644
index 0000000000..54565ca6f1
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-notFoundComponent.tsx
@@ -0,0 +1,11 @@
+const $$splitNotFoundComponentImporter = () => import('imported-notFoundComponent.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+const $$splitComponentImporter = () => import('imported-notFoundComponent.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ notFoundComponent: lazyRouteComponent($$splitNotFoundComponentImporter, 'notFoundComponent')
+});
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-notFoundComponent@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-notFoundComponent@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..e4e3e353fd
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-notFoundComponent@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,5 @@
+import ImportedDefaultComponent, { importedNotFoundComponent } from '../shared/imported';
+const SplitComponent = ImportedDefaultComponent;
+export { SplitComponent as component };
+const SplitNotFoundComponent = importedNotFoundComponent;
+export { SplitNotFoundComponent as notFoundComponent };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-notFoundComponent@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-notFoundComponent@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-pendingComponent.tsx
new file mode 100644
index 0000000000..02997dc053
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-pendingComponent.tsx
@@ -0,0 +1,11 @@
+const $$splitPendingComponentImporter = () => import('imported-pendingComponent.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+const $$splitComponentImporter = () => import('imported-pendingComponent.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ pendingComponent: lazyRouteComponent($$splitPendingComponentImporter, 'pendingComponent')
+});
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-pendingComponent@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-pendingComponent@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..aaa3ecd4f9
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-pendingComponent@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,5 @@
+import ImportedDefaultComponent, { importedPendingComponent } from '../shared/imported';
+const SplitComponent = ImportedDefaultComponent;
+export { SplitComponent as component };
+const SplitPendingComponent = importedPendingComponent;
+export { SplitPendingComponent as pendingComponent };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-pendingComponent@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported-pendingComponent@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported.tsx
new file mode 100644
index 0000000000..c397f9dccc
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported.tsx
@@ -0,0 +1,12 @@
+const $$splitLoaderImporter = () => import('imported.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+const $$splitComponentImporter = () => import('imported.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ loader: lazyFn($$splitLoaderImporter, 'loader')
+});
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/development/imported@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 67%
rename from packages/router-plugin/tests/code-splitter/snapshots/development/imported@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported@component---loader---notFoundComponent---pendingComponent.tsx
index 47c62497db..d7310c1c94 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/development/imported@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported@component---loader---notFoundComponent---pendingComponent.tsx
@@ -1,5 +1,5 @@
import { importedComponent, importedLoader } from '../shared/imported';
-const SplitComponent = importedComponent;
-export { SplitComponent as component };
const SplitLoader = importedLoader;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitLoader as loader };
+const SplitComponent = importedComponent;
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/imported@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/inline.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/inline.tsx
new file mode 100644
index 0000000000..fd3669b108
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/inline.tsx
@@ -0,0 +1,11 @@
+const $$splitComponentImporter = () => import('inline.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
+Route.addChildren([]);
+export const test = 'test';
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/inline@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/inline@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..dd352c63ae
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/inline@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,18 @@
+import * as styles from '../style.css';
+import { TEST_DATA } from '../test.const';
+const Button = (props: {
+ children: any;
+}) => {
+ return ;
+};
+import { Route } from "inline.tsx";
+Route.addChildren([]);
+import { test } from "inline.tsx";
+const SplitComponent = () => {
+ return
+ {test}
+
{TEST_DATA.welcome}
+
+
;
+};
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/inline@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/inline@errorComponent.tsx
new file mode 100644
index 0000000000..a9c5d2b6de
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/inline@errorComponent.tsx
@@ -0,0 +1,2 @@
+import { Route } from "inline.tsx";
+Route.addChildren([]);
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/random-number.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/random-number.tsx
new file mode 100644
index 0000000000..9a267bfdb0
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/random-number.tsx
@@ -0,0 +1,14 @@
+const $$splitComponentImporter = () => import('random-number.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+const $$splitLoaderImporter = () => import('random-number.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const textColors = [`text-rose-500`, `text-yellow-500`, `text-teal-500`, `text-blue-500`];
+export const gradients = [`from-rose-500 to-yellow-500`, `from-yellow-500 to-teal-500`, `from-teal-500 to-violet-500`, `from-blue-500 to-pink-500`];
+export const Route = createFileRoute('/')({
+ loader: lazyFn($$splitLoaderImporter, 'loader'),
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/production/random-number@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/random-number@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 91%
rename from packages/router-plugin/tests/code-splitter/snapshots/production/random-number@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/random-number@component---loader---notFoundComponent---pendingComponent.tsx
index 7aaa5496f4..1faa5012de 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/production/random-number@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/random-number@component---loader---notFoundComponent---pendingComponent.tsx
@@ -5,6 +5,13 @@ import { sample } from '~/utils/utils';
import { textColors } from "random-number.tsx";
import { gradients } from "random-number.tsx";
import { Route } from "random-number.tsx";
+const SplitLoader = () => {
+ return {
+ randomNumber: Math.random(),
+ sponsorsPromise: defer(getSponsorsForSponsorPack())
+ };
+};
+export { SplitLoader as loader };
const SplitComponent = function Index() {
const {
randomNumber
@@ -17,11 +24,4 @@ const SplitComponent = function Index() {
{textColor}
;
};
-export { SplitComponent as component };
-const SplitLoader = () => {
- return {
- randomNumber: Math.random(),
- sponsorsPromise: defer(getSponsorsForSponsorPack())
- };
-};
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/random-number@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/random-number@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-component.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-component.tsx
new file mode 100644
index 0000000000..66da0c232a
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-component.tsx
@@ -0,0 +1,12 @@
+const $$splitLoaderImporter = () => import('react-memo-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+const $$splitComponentImporter = () => import('react-memo-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ loader: lazyFn($$splitLoaderImporter, 'loader')
+});
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/production/react-memo-component@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-component@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 74%
rename from packages/router-plugin/tests/code-splitter/snapshots/production/react-memo-component@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-component@component---loader---notFoundComponent---pendingComponent.tsx
index 2ccf4684ae..8831513c0e 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/production/react-memo-component@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-component@component---loader---notFoundComponent---pendingComponent.tsx
@@ -3,7 +3,7 @@ import { importedLoader } from '../shared/imported';
function Component() {
return
Component
;
}
-const SplitComponent = React.memo(Component);
-export { SplitComponent as component };
const SplitLoader = importedLoader;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitLoader as loader };
+const SplitComponent = React.memo(Component);
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-component@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-component@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-imported-component.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-imported-component.tsx
new file mode 100644
index 0000000000..8db833f30c
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-imported-component.tsx
@@ -0,0 +1,12 @@
+const $$splitLoaderImporter = () => import('react-memo-imported-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+const $$splitComponentImporter = () => import('react-memo-imported-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ loader: lazyFn($$splitLoaderImporter, 'loader')
+});
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/development/react-memo-imported-component@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-imported-component@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 72%
rename from packages/router-plugin/tests/code-splitter/snapshots/development/react-memo-imported-component@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-imported-component@component---loader---notFoundComponent---pendingComponent.tsx
index f8e62e3e2b..b979ac5fa4 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/development/react-memo-imported-component@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-imported-component@component---loader---notFoundComponent---pendingComponent.tsx
@@ -1,6 +1,6 @@
import React from 'react';
import { importedLoader, importedComponent } from '../shared/imported';
-const SplitComponent = React.memo(importedComponent);
-export { SplitComponent as component };
const SplitLoader = importedLoader;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitLoader as loader };
+const SplitComponent = React.memo(importedComponent);
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-imported-component@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/react-memo-imported-component@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-export-component.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-export-component.tsx
new file mode 100644
index 0000000000..8373e85c77
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-export-component.tsx
@@ -0,0 +1,27 @@
+const $$splitLoaderImporter = () => import('retain-export-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+import { createFileRoute, Outlet } from '@tanstack/react-router';
+import { importedComponent as ImportedComponent } from '../shared/imported';
+export function Layout() {
+ return
+
+
+
+
+
+ ;
+}
+export const Route = createFileRoute('/_layout')({
+ component: Layout,
+ loader: lazyFn($$splitLoaderImporter, 'loader')
+});
+const HEADER_HEIGHT = '63px';
+export const SIDEBAR_WIDTH = '150px';
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-export-component@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-export-component@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..c187fe188e
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-export-component@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,3 @@
+import { importedLoader } from '../shared/imported';
+const SplitLoader = importedLoader;
+export { SplitLoader as loader };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-export-component@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-export-component@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-const.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-const.tsx
new file mode 100644
index 0000000000..69e27260d4
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-const.tsx
@@ -0,0 +1,30 @@
+import { createFileRoute, Outlet } from '@tanstack/react-router';
+import { importedComponent as ImportedComponent, importedLoader } from '../shared/imported';
+export const loaderFn = () => {
+ return importedLoader();
+};
+const Layout = () => {
+ return
+
+
+
+
+
+ ;
+};
+export const Route = createFileRoute('/_layout')({
+ component: Layout,
+ loader: loaderFn
+});
+const HEADER_HEIGHT = '63px';
+export const SIDEBAR_WIDTH = '150px';
+export const SIDEBAR_MINI_WIDTH = '80px';
+export default Layout;
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-const@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-const@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-const@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-const@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-function.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-function.tsx
new file mode 100644
index 0000000000..8162228c27
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-function.tsx
@@ -0,0 +1,30 @@
+import { createFileRoute, Outlet } from '@tanstack/react-router';
+import { importedComponent as ImportedComponent, importedLoader } from '../shared/imported';
+export function loaderFn() {
+ return importedLoader();
+}
+function Layout() {
+ return
+
+
+
+
+
+ ;
+}
+export const Route = createFileRoute('/_layout')({
+ component: Layout,
+ loader: loaderFn
+});
+const HEADER_HEIGHT = '63px';
+export const SIDEBAR_WIDTH = '150px';
+export const SIDEBAR_MINI_WIDTH = '80px';
+export default Layout;
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-function@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-function@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-function@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-function@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-loader.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-loader.tsx
new file mode 100644
index 0000000000..0befce3a09
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-loader.tsx
@@ -0,0 +1,17 @@
+const $$splitComponentImporter = () => import('retain-exports-loader.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export function loaderFn() {
+ return {
+ foo: 'bar'
+ };
+}
+export const Route = createFileRoute('/_layout')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ loader: loaderFn
+});
+export const SIDEBAR_WIDTH = '150px';
+export const SIDEBAR_MINI_WIDTH = '80px';
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-loader@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-loader@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..dde7ab5b9d
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-loader@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,21 @@
+import { Outlet } from '@tanstack/react-router';
+import { importedComponent as ImportedComponent } from '../shared/imported';
+const HEADER_HEIGHT = '63px';
+const SplitComponent = function Layout() {
+ return
+
+
+
+
+
+ ;
+};
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-loader@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/retain-exports-loader@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/useStateDestructure.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/useStateDestructure.tsx
new file mode 100644
index 0000000000..414db66c2e
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/useStateDestructure.tsx
@@ -0,0 +1,15 @@
+const $$splitComponentImporter = () => import('useStateDestructure.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { startProject } from '~/projects/start';
+import { createFileRoute } from '@tanstack/react-router';
+import { seo } from '~/utils/seo';
+export const Route = createFileRoute('/_libraries/start/$version/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ meta: () => seo({
+ title: startProject.name,
+ description: startProject.description
+ })
+});
+export function TSRDummyComponent() {
+ return null;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/useStateDestructure@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/useStateDestructure@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..10f2c2d667
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/development/useStateDestructure@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,605 @@
+import * as React from 'react';
+import { CgCornerUpLeft, CgSpinner } from 'react-icons/cg';
+import { FaDiscord, FaGithub, FaTshirt, FaTwitter } from 'react-icons/fa';
+import { Await, Link, getRouteApi } from '@tanstack/react-router';
+import { Carbon } from '~/components/Carbon';
+import { Footer } from '~/components/Footer';
+import { TbHeartHandshake } from 'react-icons/tb';
+import SponsorPack from '~/components/SponsorPack';
+import { startProject } from '~/projects/start';
+const menu = [{
+ label:
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ Writing your data fetching logic by hand is over. Tell TanStack
+ Query where to get your data and how fresh you need it to be and
+ the rest is automatic. It handles{' '}
+
+ caching, background updates and stale data out of the box with
+ zero-configuration
+
+ .
+
+
+
+
+
+
+
+
+
+ Simple & Familiar
+
+
+ If you know how to work with promises or async/await, then you
+ already know how to use TanStack Query. There's{' '}
+
+ no global state to manage, reducers, normalization systems or
+ heavy configurations to understand
+
+ . Simply pass a function that resolves your data (or throws an
+ error) and the rest is history.
+
+
+
+
+
+
+
+
+
+ Extensible
+
+
+ TanStack Query is configurable down to each observer instance of a
+ query with knobs and options to fit every use-case. It comes wired
+ up with{' '}
+
+ dedicated devtools, infinite-loading APIs, and first class
+ mutation tools that make updating your data a breeze
+
+ . Don't worry though, everything is pre-configured for success!
+
+
+
+
*/}
+
+ {/*
+
+
+ No dependencies. All the Features.
+
+
+ With zero dependencies, TanStack Query is extremely lean given the
+ dense feature set it provides. From weekend hobbies all the way to
+ enterprise e-commerce systems (Yes, I'm lookin' at you Walmart! 😉),
+ TanStack Query is the battle-hardened tool to help you succeed at
+ the speed of your creativity.
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+
+ This ad helps us be happy about our invested time and not burn out and
+ rage-quit OSS. Yay money! 😉
+
+
+
+ {/*
+
+
+ Less code, fewer edge cases.
+
+
+ Instead of writing reducers, caching logic, timers, retry logic,
+ complex async/await scripting (I could keep going...), you literally
+ write a tiny fraction of the code you normally would. You will be
+ surprised at how little code you're writing or how much code you're
+ deleting when you use TanStack Query. Try it out with one of the
+ examples below!
+
+ Looking for the @tanstack/{framework}-query{' '}
+ example? We could use your help to build the{' '}
+ @tanstack/{framework}-query adapter! Join the{' '}
+
+ TanStack Discord Server
+ {' '}
+ and let's get to work!
+
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ Writing your data fetching logic by hand is over. Tell TanStack
+ Query where to get your data and how fresh you need it to be and
+ the rest is automatic. It handles{' '}
+
+ caching, background updates and stale data out of the box with
+ zero-configuration
+
+ .
+
+
+
+
+
+
+
+
+
+ Simple & Familiar
+
+
+ If you know how to work with promises or async/await, then you
+ already know how to use TanStack Query. There's{' '}
+
+ no global state to manage, reducers, normalization systems or
+ heavy configurations to understand
+
+ . Simply pass a function that resolves your data (or throws an
+ error) and the rest is history.
+
+
+
+
+
+
+
+
+
+ Extensible
+
+
+ TanStack Query is configurable down to each observer instance of a
+ query with knobs and options to fit every use-case. It comes wired
+ up with{' '}
+
+ dedicated devtools, infinite-loading APIs, and first class
+ mutation tools that make updating your data a breeze
+
+ . Don't worry though, everything is pre-configured for success!
+
+
+
+
*/}
+
+ {/*
+
+
+ No dependencies. All the Features.
+
+
+ With zero dependencies, TanStack Query is extremely lean given the
+ dense feature set it provides. From weekend hobbies all the way to
+ enterprise e-commerce systems (Yes, I'm lookin' at you Walmart! 😉),
+ TanStack Query is the battle-hardened tool to help you succeed at
+ the speed of your creativity.
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+
+ This ad helps us be happy about our invested time and not burn out and
+ rage-quit OSS. Yay money! 😉
+
+
+
+ {/*
+
+
+ Less code, fewer edge cases.
+
+
+ Instead of writing reducers, caching logic, timers, retry logic,
+ complex async/await scripting (I could keep going...), you literally
+ write a tiny fraction of the code you normally would. You will be
+ surprised at how little code you're writing or how much code you're
+ deleting when you use TanStack Query. Try it out with one of the
+ examples below!
+
+ Looking for the @tanstack/{framework}-query{' '}
+ example? We could use your help to build the{' '}
+ @tanstack/{framework}-query adapter! Join the{' '}
+
+ TanStack Discord Server
+ {' '}
+ and let's get to work!
+
+
+ ) : (
+
+
+
+ )} */}
+
+ {/*
+
+ Wow, you've come a long way!
+
+
+ Only one thing left to do...
+
+
+
+ Read the Docs!
+
+
+
*/}
+
+
;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/arrow-function.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/arrow-function.tsx
new file mode 100644
index 0000000000..36facc8ac7
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/arrow-function.tsx
@@ -0,0 +1,9 @@
+const $$splitComponentImporter = () => import('arrow-function.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+const $$splitLoaderImporter = () => import('arrow-function.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/posts')({
+ loader: lazyFn($$splitLoaderImporter, 'loader'),
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/production/arrow-function@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/arrow-function@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 92%
rename from packages/router-plugin/tests/code-splitter/snapshots/production/arrow-function@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/arrow-function@component---loader---notFoundComponent---pendingComponent.tsx
index 620b059230..7dd37cda89 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/production/arrow-function@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/arrow-function@component---loader---notFoundComponent---pendingComponent.tsx
@@ -1,6 +1,8 @@
import { Link, Outlet } from '@tanstack/react-router';
import { fetchPosts } from '../posts';
import { Route } from "arrow-function.tsx";
+const SplitLoader = fetchPosts;
+export { SplitLoader as loader };
const SplitComponent = () => {
const posts = Route.useLoaderData();
return
@@ -24,6 +26,4 @@ const SplitComponent = () => {
;
};
-export { SplitComponent as component };
-const SplitLoader = fetchPosts;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/arrow-function@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/arrow-function@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/chinese.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/chinese.tsx
new file mode 100644
index 0000000000..0902b78c6a
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/chinese.tsx
@@ -0,0 +1,9 @@
+const $$splitComponentImporter = () => import('chinese.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
+interface DemoProps {
+ title: string;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/chinese@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/chinese@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..6e6df2f4eb
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/chinese@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,22 @@
+interface DemoProps {
+ title: string;
+}
+function Demo({
+ title
+}: DemoProps) {
+ return
+ {title}
+
;
+}
+const SplitComponent = function HomeComponent() {
+ return
+
+
+
;
+};
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/chinese@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/chinese@errorComponent.tsx
new file mode 100644
index 0000000000..f5392fada0
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/chinese@errorComponent.tsx
@@ -0,0 +1,3 @@
+interface DemoProps {
+ title: string;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/conditional-properties.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/conditional-properties.tsx
new file mode 100644
index 0000000000..fe3a1fa350
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/conditional-properties.tsx
@@ -0,0 +1,9 @@
+const $$splitLoaderImporter = () => import('conditional-properties.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+const $$splitComponentImporter = () => import('conditional-properties.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/posts')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ loader: lazyFn($$splitLoaderImporter, 'loader')
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/production/conditional-properties@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/conditional-properties@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 81%
rename from packages/router-plugin/tests/code-splitter/snapshots/production/conditional-properties@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/conditional-properties@component---loader---notFoundComponent---pendingComponent.tsx
index d483dd047c..857b130de7 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/production/conditional-properties@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/conditional-properties@component---loader---notFoundComponent---pendingComponent.tsx
@@ -1,7 +1,7 @@
import { isEnabled } from '@features/feature-flags';
import TrueImport from '@modules/true-component';
import { FalseComponent, falseLoader } from '@modules/false-component';
-const SplitComponent = isEnabled ? TrueImport.Component : FalseComponent;
-export { SplitComponent as component };
const SplitLoader = isEnabled ? TrueImport.loader : falseLoader;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitLoader as loader };
+const SplitComponent = isEnabled ? TrueImport.Component : FalseComponent;
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/conditional-properties@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/conditional-properties@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructured-react-memo-imported-component.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructured-react-memo-imported-component.tsx
new file mode 100644
index 0000000000..1edba360e1
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructured-react-memo-imported-component.tsx
@@ -0,0 +1,9 @@
+const $$splitLoaderImporter = () => import('destructured-react-memo-imported-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+const $$splitComponentImporter = () => import('destructured-react-memo-imported-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ loader: lazyFn($$splitLoaderImporter, 'loader')
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/production/destructured-react-memo-imported-component@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructured-react-memo-imported-component@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 74%
rename from packages/router-plugin/tests/code-splitter/snapshots/production/destructured-react-memo-imported-component@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructured-react-memo-imported-component@component---loader---notFoundComponent---pendingComponent.tsx
index 5d248932f2..b6748bb51b 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/production/destructured-react-memo-imported-component@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructured-react-memo-imported-component@component---loader---notFoundComponent---pendingComponent.tsx
@@ -3,7 +3,7 @@ import { importedLoader } from '../shared/imported';
function Component() {
return
Component
;
}
-const SplitComponent = memo(Component);
-export { SplitComponent as component };
const SplitLoader = importedLoader;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitLoader as loader };
+const SplitComponent = memo(Component);
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructured-react-memo-imported-component@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructured-react-memo-imported-component@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructuring.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructuring.tsx
new file mode 100644
index 0000000000..858c5c0e05
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructuring.tsx
@@ -0,0 +1,11 @@
+import thing from 'thing';
+export function test() {
+ const {
+ foo: {
+ bar: {
+ destructured
+ }
+ }
+ } = thing;
+ return destructured;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructuring@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructuring@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..858c5c0e05
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructuring@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,11 @@
+import thing from 'thing';
+export function test() {
+ const {
+ foo: {
+ bar: {
+ destructured
+ }
+ }
+ } = thing;
+ return destructured;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructuring@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructuring@errorComponent.tsx
new file mode 100644
index 0000000000..858c5c0e05
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/destructuring@errorComponent.tsx
@@ -0,0 +1,11 @@
+import thing from 'thing';
+export function test() {
+ const {
+ foo: {
+ bar: {
+ destructured
+ }
+ }
+ } = thing;
+ return destructured;
+}
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-as-parameter.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-as-parameter.tsx
new file mode 100644
index 0000000000..34b469f860
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-as-parameter.tsx
@@ -0,0 +1,19 @@
+import * as React from 'react';
+// @ts-expect-error
+import { useMemo } from 'tan-react';
+const ReactUseMemoCall1 = React.useMemo(function performAction() {
+ return 'true';
+}, []);
+console.info(ReactUseMemoCall1);
+const ReactUseMemoCall2 = React.useMemo(() => {
+ return 'true';
+}, []);
+console.info(ReactUseMemoCall2);
+const UseMemoCall1 = useMemo(function performAction() {
+ return 'true';
+}, []);
+console.info(UseMemoCall1);
+const UseMemoCall2 = useMemo(() => {
+ return 'true';
+}, []);
+console.info(UseMemoCall2);
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-as-parameter@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-as-parameter@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..34b469f860
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-as-parameter@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,19 @@
+import * as React from 'react';
+// @ts-expect-error
+import { useMemo } from 'tan-react';
+const ReactUseMemoCall1 = React.useMemo(function performAction() {
+ return 'true';
+}, []);
+console.info(ReactUseMemoCall1);
+const ReactUseMemoCall2 = React.useMemo(() => {
+ return 'true';
+}, []);
+console.info(ReactUseMemoCall2);
+const UseMemoCall1 = useMemo(function performAction() {
+ return 'true';
+}, []);
+console.info(UseMemoCall1);
+const UseMemoCall2 = useMemo(() => {
+ return 'true';
+}, []);
+console.info(UseMemoCall2);
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-as-parameter@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-as-parameter@errorComponent.tsx
new file mode 100644
index 0000000000..34b469f860
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-as-parameter@errorComponent.tsx
@@ -0,0 +1,19 @@
+import * as React from 'react';
+// @ts-expect-error
+import { useMemo } from 'tan-react';
+const ReactUseMemoCall1 = React.useMemo(function performAction() {
+ return 'true';
+}, []);
+console.info(ReactUseMemoCall1);
+const ReactUseMemoCall2 = React.useMemo(() => {
+ return 'true';
+}, []);
+console.info(ReactUseMemoCall2);
+const UseMemoCall1 = useMemo(function performAction() {
+ return 'true';
+}, []);
+console.info(UseMemoCall1);
+const UseMemoCall2 = useMemo(() => {
+ return 'true';
+}, []);
+console.info(UseMemoCall2);
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-declaration.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-declaration.tsx
new file mode 100644
index 0000000000..13b2b8cc9f
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-declaration.tsx
@@ -0,0 +1,9 @@
+const $$splitComponentImporter = () => import('function-declaration.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+const $$splitLoaderImporter = () => import('function-declaration.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/posts')({
+ loader: lazyFn($$splitLoaderImporter, 'loader'),
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/production/function-declaration@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-declaration@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 92%
rename from packages/router-plugin/tests/code-splitter/snapshots/production/function-declaration@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-declaration@component---loader---notFoundComponent---pendingComponent.tsx
index 7ecd525a8b..6eadf0e795 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/production/function-declaration@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-declaration@component---loader---notFoundComponent---pendingComponent.tsx
@@ -1,6 +1,8 @@
import { Link, Outlet } from '@tanstack/react-router';
import { fetchPosts } from '../posts';
import { Route } from "function-declaration.tsx";
+const SplitLoader = fetchPosts;
+export { SplitLoader as loader };
const SplitComponent = function PostsComponent() {
const posts = Route.useLoaderData();
return
@@ -24,6 +26,4 @@ const SplitComponent = function PostsComponent() {
;
};
-export { SplitComponent as component };
-const SplitLoader = fetchPosts;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-declaration@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/function-declaration@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/importAttribute.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/importAttribute.tsx
new file mode 100644
index 0000000000..847ad400fc
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/importAttribute.tsx
@@ -0,0 +1,6 @@
+const $$splitComponentImporter = () => import('importAttribute.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/importAttribute@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/importAttribute@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..f34d3c6408
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/importAttribute@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,3 @@
+import { test } from './test' with { type: 'macro' };
+const SplitComponent = () => test;
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/importAttribute@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/importAttribute@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component-destructured-loader.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component-destructured-loader.tsx
new file mode 100644
index 0000000000..a110778506
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component-destructured-loader.tsx
@@ -0,0 +1,9 @@
+const $$splitLoaderImporter = () => import('imported-default-component-destructured-loader.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+const $$splitComponentImporter = () => import('imported-default-component-destructured-loader.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ loader: lazyFn($$splitLoaderImporter, 'loader')
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/development/imported-default-component-destructured-loader@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component-destructured-loader@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 67%
rename from packages/router-plugin/tests/code-splitter/snapshots/development/imported-default-component-destructured-loader@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component-destructured-loader@component---loader---notFoundComponent---pendingComponent.tsx
index 36b0a4fd34..7ca09fd5d7 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/development/imported-default-component-destructured-loader@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component-destructured-loader@component---loader---notFoundComponent---pendingComponent.tsx
@@ -1,5 +1,5 @@
import importedComponent, { importedLoader } from '../shared/imported';
-const SplitComponent = importedComponent;
-export { SplitComponent as component };
const SplitLoader = importedLoader;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitLoader as loader };
+const SplitComponent = importedComponent;
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component-destructured-loader@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component-destructured-loader@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component.tsx
new file mode 100644
index 0000000000..bd196be036
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component.tsx
@@ -0,0 +1,6 @@
+const $$splitComponentImporter = () => import('imported-default-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..c52d2691b4
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,3 @@
+import ImportedDefaultComponent from '../shared/imported';
+const SplitComponent = ImportedDefaultComponent;
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-default-component@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-errorComponent.tsx
new file mode 100644
index 0000000000..f58664d12a
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-errorComponent.tsx
@@ -0,0 +1,8 @@
+const $$splitErrorComponentImporter = () => import('imported-errorComponent.tsx?tsr-split=errorComponent');
+const $$splitComponentImporter = () => import('imported-errorComponent.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ errorComponent: lazyRouteComponent($$splitErrorComponentImporter, 'errorComponent')
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-errorComponent@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-errorComponent@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..c52d2691b4
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-errorComponent@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,3 @@
+import ImportedDefaultComponent from '../shared/imported';
+const SplitComponent = ImportedDefaultComponent;
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-errorComponent@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-errorComponent@errorComponent.tsx
new file mode 100644
index 0000000000..1d7f487fd2
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-errorComponent@errorComponent.tsx
@@ -0,0 +1,3 @@
+import { importedErrorComponent } from '../shared/imported';
+const SplitErrorComponent = importedErrorComponent;
+export { SplitErrorComponent as errorComponent };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-notFoundComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-notFoundComponent.tsx
new file mode 100644
index 0000000000..3880466641
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-notFoundComponent.tsx
@@ -0,0 +1,8 @@
+const $$splitNotFoundComponentImporter = () => import('imported-notFoundComponent.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+const $$splitComponentImporter = () => import('imported-notFoundComponent.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ notFoundComponent: lazyRouteComponent($$splitNotFoundComponentImporter, 'notFoundComponent')
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-notFoundComponent@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-notFoundComponent@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..e4e3e353fd
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-notFoundComponent@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,5 @@
+import ImportedDefaultComponent, { importedNotFoundComponent } from '../shared/imported';
+const SplitComponent = ImportedDefaultComponent;
+export { SplitComponent as component };
+const SplitNotFoundComponent = importedNotFoundComponent;
+export { SplitNotFoundComponent as notFoundComponent };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-notFoundComponent@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-notFoundComponent@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-pendingComponent.tsx
new file mode 100644
index 0000000000..939c087ebb
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-pendingComponent.tsx
@@ -0,0 +1,8 @@
+const $$splitPendingComponentImporter = () => import('imported-pendingComponent.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+const $$splitComponentImporter = () => import('imported-pendingComponent.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ pendingComponent: lazyRouteComponent($$splitPendingComponentImporter, 'pendingComponent')
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-pendingComponent@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-pendingComponent@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..aaa3ecd4f9
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-pendingComponent@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,5 @@
+import ImportedDefaultComponent, { importedPendingComponent } from '../shared/imported';
+const SplitComponent = ImportedDefaultComponent;
+export { SplitComponent as component };
+const SplitPendingComponent = importedPendingComponent;
+export { SplitPendingComponent as pendingComponent };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-pendingComponent@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported-pendingComponent@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported.tsx
new file mode 100644
index 0000000000..0bbac9035a
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported.tsx
@@ -0,0 +1,9 @@
+const $$splitLoaderImporter = () => import('imported.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+const $$splitComponentImporter = () => import('imported.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ loader: lazyFn($$splitLoaderImporter, 'loader')
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/production/imported@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 67%
rename from packages/router-plugin/tests/code-splitter/snapshots/production/imported@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported@component---loader---notFoundComponent---pendingComponent.tsx
index 47c62497db..d7310c1c94 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/production/imported@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported@component---loader---notFoundComponent---pendingComponent.tsx
@@ -1,5 +1,5 @@
import { importedComponent, importedLoader } from '../shared/imported';
-const SplitComponent = importedComponent;
-export { SplitComponent as component };
const SplitLoader = importedLoader;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitLoader as loader };
+const SplitComponent = importedComponent;
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/imported@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/inline.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/inline.tsx
new file mode 100644
index 0000000000..5655e25a26
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/inline.tsx
@@ -0,0 +1,8 @@
+const $$splitComponentImporter = () => import('inline.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
+Route.addChildren([]);
+export const test = 'test';
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/inline@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/inline@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..dd352c63ae
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/inline@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,18 @@
+import * as styles from '../style.css';
+import { TEST_DATA } from '../test.const';
+const Button = (props: {
+ children: any;
+}) => {
+ return ;
+};
+import { Route } from "inline.tsx";
+Route.addChildren([]);
+import { test } from "inline.tsx";
+const SplitComponent = () => {
+ return
+ {test}
+
{TEST_DATA.welcome}
+
+
;
+};
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/inline@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/inline@errorComponent.tsx
new file mode 100644
index 0000000000..a9c5d2b6de
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/inline@errorComponent.tsx
@@ -0,0 +1,2 @@
+import { Route } from "inline.tsx";
+Route.addChildren([]);
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/random-number.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/random-number.tsx
new file mode 100644
index 0000000000..e2b0321f7f
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/random-number.tsx
@@ -0,0 +1,11 @@
+const $$splitComponentImporter = () => import('random-number.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+const $$splitLoaderImporter = () => import('random-number.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const textColors = [`text-rose-500`, `text-yellow-500`, `text-teal-500`, `text-blue-500`];
+export const gradients = [`from-rose-500 to-yellow-500`, `from-yellow-500 to-teal-500`, `from-teal-500 to-violet-500`, `from-blue-500 to-pink-500`];
+export const Route = createFileRoute('/')({
+ loader: lazyFn($$splitLoaderImporter, 'loader'),
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr)
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/development/random-number@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/random-number@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 91%
rename from packages/router-plugin/tests/code-splitter/snapshots/development/random-number@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/random-number@component---loader---notFoundComponent---pendingComponent.tsx
index 7aaa5496f4..1faa5012de 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/development/random-number@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/random-number@component---loader---notFoundComponent---pendingComponent.tsx
@@ -5,6 +5,13 @@ import { sample } from '~/utils/utils';
import { textColors } from "random-number.tsx";
import { gradients } from "random-number.tsx";
import { Route } from "random-number.tsx";
+const SplitLoader = () => {
+ return {
+ randomNumber: Math.random(),
+ sponsorsPromise: defer(getSponsorsForSponsorPack())
+ };
+};
+export { SplitLoader as loader };
const SplitComponent = function Index() {
const {
randomNumber
@@ -17,11 +24,4 @@ const SplitComponent = function Index() {
{textColor}
;
};
-export { SplitComponent as component };
-const SplitLoader = () => {
- return {
- randomNumber: Math.random(),
- sponsorsPromise: defer(getSponsorsForSponsorPack())
- };
-};
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/random-number@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/random-number@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-component.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-component.tsx
new file mode 100644
index 0000000000..1043478308
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-component.tsx
@@ -0,0 +1,9 @@
+const $$splitLoaderImporter = () => import('react-memo-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+const $$splitComponentImporter = () => import('react-memo-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ loader: lazyFn($$splitLoaderImporter, 'loader')
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/development/react-memo-component@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-component@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 74%
rename from packages/router-plugin/tests/code-splitter/snapshots/development/react-memo-component@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-component@component---loader---notFoundComponent---pendingComponent.tsx
index 2ccf4684ae..8831513c0e 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/development/react-memo-component@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-component@component---loader---notFoundComponent---pendingComponent.tsx
@@ -3,7 +3,7 @@ import { importedLoader } from '../shared/imported';
function Component() {
return
Component
;
}
-const SplitComponent = React.memo(Component);
-export { SplitComponent as component };
const SplitLoader = importedLoader;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitLoader as loader };
+const SplitComponent = React.memo(Component);
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-component@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-component@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-imported-component.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-imported-component.tsx
new file mode 100644
index 0000000000..c3f6ce2057
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-imported-component.tsx
@@ -0,0 +1,9 @@
+const $$splitLoaderImporter = () => import('react-memo-imported-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+const $$splitComponentImporter = () => import('react-memo-imported-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export const Route = createFileRoute('/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ loader: lazyFn($$splitLoaderImporter, 'loader')
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/production/react-memo-imported-component@split.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-imported-component@component---loader---notFoundComponent---pendingComponent.tsx
similarity index 72%
rename from packages/router-plugin/tests/code-splitter/snapshots/production/react-memo-imported-component@split.tsx
rename to packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-imported-component@component---loader---notFoundComponent---pendingComponent.tsx
index f8e62e3e2b..b979ac5fa4 100644
--- a/packages/router-plugin/tests/code-splitter/snapshots/production/react-memo-imported-component@split.tsx
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-imported-component@component---loader---notFoundComponent---pendingComponent.tsx
@@ -1,6 +1,6 @@
import React from 'react';
import { importedLoader, importedComponent } from '../shared/imported';
-const SplitComponent = React.memo(importedComponent);
-export { SplitComponent as component };
const SplitLoader = importedLoader;
-export { SplitLoader as loader };
\ No newline at end of file
+export { SplitLoader as loader };
+const SplitComponent = React.memo(importedComponent);
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-imported-component@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/react-memo-imported-component@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-export-component.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-export-component.tsx
new file mode 100644
index 0000000000..8373e85c77
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-export-component.tsx
@@ -0,0 +1,27 @@
+const $$splitLoaderImporter = () => import('retain-export-component.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyFn } from '@tanstack/react-router';
+import { createFileRoute, Outlet } from '@tanstack/react-router';
+import { importedComponent as ImportedComponent } from '../shared/imported';
+export function Layout() {
+ return
+
+
+
+
+
+ ;
+}
+export const Route = createFileRoute('/_layout')({
+ component: Layout,
+ loader: lazyFn($$splitLoaderImporter, 'loader')
+});
+const HEADER_HEIGHT = '63px';
+export const SIDEBAR_WIDTH = '150px';
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-export-component@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-export-component@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..c187fe188e
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-export-component@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,3 @@
+import { importedLoader } from '../shared/imported';
+const SplitLoader = importedLoader;
+export { SplitLoader as loader };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-export-component@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-export-component@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-const.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-const.tsx
new file mode 100644
index 0000000000..69e27260d4
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-const.tsx
@@ -0,0 +1,30 @@
+import { createFileRoute, Outlet } from '@tanstack/react-router';
+import { importedComponent as ImportedComponent, importedLoader } from '../shared/imported';
+export const loaderFn = () => {
+ return importedLoader();
+};
+const Layout = () => {
+ return
+
+
+
+
+
+ ;
+};
+export const Route = createFileRoute('/_layout')({
+ component: Layout,
+ loader: loaderFn
+});
+const HEADER_HEIGHT = '63px';
+export const SIDEBAR_WIDTH = '150px';
+export const SIDEBAR_MINI_WIDTH = '80px';
+export default Layout;
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-const@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-const@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-const@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-const@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-function.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-function.tsx
new file mode 100644
index 0000000000..8162228c27
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-function.tsx
@@ -0,0 +1,30 @@
+import { createFileRoute, Outlet } from '@tanstack/react-router';
+import { importedComponent as ImportedComponent, importedLoader } from '../shared/imported';
+export function loaderFn() {
+ return importedLoader();
+}
+function Layout() {
+ return
+
+
+
+
+
+ ;
+}
+export const Route = createFileRoute('/_layout')({
+ component: Layout,
+ loader: loaderFn
+});
+const HEADER_HEIGHT = '63px';
+export const SIDEBAR_WIDTH = '150px';
+export const SIDEBAR_MINI_WIDTH = '80px';
+export default Layout;
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-function@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-function@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-function@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-function@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-loader.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-loader.tsx
new file mode 100644
index 0000000000..72982be00f
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-loader.tsx
@@ -0,0 +1,14 @@
+const $$splitComponentImporter = () => import('retain-exports-loader.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { createFileRoute } from '@tanstack/react-router';
+export function loaderFn() {
+ return {
+ foo: 'bar'
+ };
+}
+export const Route = createFileRoute('/_layout')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ loader: loaderFn
+});
+export const SIDEBAR_WIDTH = '150px';
+export const SIDEBAR_MINI_WIDTH = '80px';
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-loader@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-loader@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..dde7ab5b9d
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-loader@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,21 @@
+import { Outlet } from '@tanstack/react-router';
+import { importedComponent as ImportedComponent } from '../shared/imported';
+const HEADER_HEIGHT = '63px';
+const SplitComponent = function Layout() {
+ return
+
+
+
+
+
+ ;
+};
+export { SplitComponent as component };
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-loader@errorComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/retain-exports-loader@errorComponent.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/useStateDestructure.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/useStateDestructure.tsx
new file mode 100644
index 0000000000..ba8e58205b
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/useStateDestructure.tsx
@@ -0,0 +1,12 @@
+const $$splitComponentImporter = () => import('useStateDestructure.tsx?tsr-split=component---loader---notFoundComponent---pendingComponent');
+import { lazyRouteComponent } from '@tanstack/react-router';
+import { startProject } from '~/projects/start';
+import { createFileRoute } from '@tanstack/react-router';
+import { seo } from '~/utils/seo';
+export const Route = createFileRoute('/_libraries/start/$version/')({
+ component: lazyRouteComponent($$splitComponentImporter, 'component', () => Route.ssr),
+ meta: () => seo({
+ title: startProject.name,
+ description: startProject.description
+ })
+});
\ No newline at end of file
diff --git a/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/useStateDestructure@component---loader---notFoundComponent---pendingComponent.tsx b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/useStateDestructure@component---loader---notFoundComponent---pendingComponent.tsx
new file mode 100644
index 0000000000..10f2c2d667
--- /dev/null
+++ b/packages/router-plugin/tests/code-splitter/snapshots/3-all-combined-errorComponent-separate/production/useStateDestructure@component---loader---notFoundComponent---pendingComponent.tsx
@@ -0,0 +1,605 @@
+import * as React from 'react';
+import { CgCornerUpLeft, CgSpinner } from 'react-icons/cg';
+import { FaDiscord, FaGithub, FaTshirt, FaTwitter } from 'react-icons/fa';
+import { Await, Link, getRouteApi } from '@tanstack/react-router';
+import { Carbon } from '~/components/Carbon';
+import { Footer } from '~/components/Footer';
+import { TbHeartHandshake } from 'react-icons/tb';
+import SponsorPack from '~/components/SponsorPack';
+import { startProject } from '~/projects/start';
+const menu = [{
+ label:
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ Writing your data fetching logic by hand is over. Tell TanStack
+ Query where to get your data and how fresh you need it to be and
+ the rest is automatic. It handles{' '}
+
+ caching, background updates and stale data out of the box with
+ zero-configuration
+
+ .
+
+
+
+
+
+
+
+
+
+ Simple & Familiar
+
+
+ If you know how to work with promises or async/await, then you
+ already know how to use TanStack Query. There's{' '}
+
+ no global state to manage, reducers, normalization systems or
+ heavy configurations to understand
+
+ . Simply pass a function that resolves your data (or throws an
+ error) and the rest is history.
+
+
+
+
+
+
+
+
+
+ Extensible
+
+
+ TanStack Query is configurable down to each observer instance of a
+ query with knobs and options to fit every use-case. It comes wired
+ up with{' '}
+
+ dedicated devtools, infinite-loading APIs, and first class
+ mutation tools that make updating your data a breeze
+
+ . Don't worry though, everything is pre-configured for success!
+
+
+
+
*/}
+
+ {/*
+
+
+ No dependencies. All the Features.
+
+
+ With zero dependencies, TanStack Query is extremely lean given the
+ dense feature set it provides. From weekend hobbies all the way to
+ enterprise e-commerce systems (Yes, I'm lookin' at you Walmart! 😉),
+ TanStack Query is the battle-hardened tool to help you succeed at
+ the speed of your creativity.
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+
+ This ad helps us be happy about our invested time and not burn out and
+ rage-quit OSS. Yay money! 😉
+
+
+
+ {/*
+
+
+ Less code, fewer edge cases.
+
+
+ Instead of writing reducers, caching logic, timers, retry logic,
+ complex async/await scripting (I could keep going...), you literally
+ write a tiny fraction of the code you normally would. You will be
+ surprised at how little code you're writing or how much code you're
+ deleting when you use TanStack Query. Try it out with one of the
+ examples below!
+
+ Looking for the @tanstack/{framework}-query{' '}
+ example? We could use your help to build the{' '}
+ @tanstack/{framework}-query adapter! Join the{' '}
+
+ TanStack Discord Server
+ {' '}
+ and let's get to work!
+
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+ Full-document SSR, Streaming, Server Functions, bundling and more,
+ powered by TanStack Router, Vinxi,{' '}
+ Nitro and Vite. Ready to deploy to
+ your favorite hosting provider.
+
+
+
+
+ So when can I use it?
+
+
+
+ TanStack Start is currently in development and is
+ not yet available for public use. We are working hard to bring you
+ the best possible experience and will be releasing more details
+ soon. In the meantime, you can follow along with the development
+ process by watching the commits on this very website!
+
+
+ Yes, you heard that right!{' '}
+
+ TanStack.com is already being built and deployed using TanStack
+ Start
+
+ ! We are eating our own dog food and are excited to share the
+ results with you soon!
+
+ Writing your data fetching logic by hand is over. Tell TanStack
+ Query where to get your data and how fresh you need it to be and
+ the rest is automatic. It handles{' '}
+
+ caching, background updates and stale data out of the box with
+ zero-configuration
+
+ .
+
+
+
+
+
+
+
+
+
+ Simple & Familiar
+
+
+ If you know how to work with promises or async/await, then you
+ already know how to use TanStack Query. There's{' '}
+
+ no global state to manage, reducers, normalization systems or
+ heavy configurations to understand
+
+ . Simply pass a function that resolves your data (or throws an
+ error) and the rest is history.
+
+
+
+
+
+
+
+
+
+ Extensible
+
+
+ TanStack Query is configurable down to each observer instance of a
+ query with knobs and options to fit every use-case. It comes wired
+ up with{' '}
+
+ dedicated devtools, infinite-loading APIs, and first class
+ mutation tools that make updating your data a breeze
+
+ . Don't worry though, everything is pre-configured for success!
+
+
+
+
*/}
+
+ {/*
+
+
+ No dependencies. All the Features.
+
+
+ With zero dependencies, TanStack Query is extremely lean given the
+ dense feature set it provides. From weekend hobbies all the way to
+ enterprise e-commerce systems (Yes, I'm lookin' at you Walmart! 😉),
+ TanStack Query is the battle-hardened tool to help you succeed at
+ the speed of your creativity.
+
+ We're looking for a TanStack Start OSS Partner to go above and
+ beyond the call of sponsorship. Are you as invested in TanStack
+ Start as we are? Let's push the boundaries of Start together!
+
+
+ This ad helps us be happy about our invested time and not burn out and
+ rage-quit OSS. Yay money! 😉
+
+
+
+ {/*
+
+
+ Less code, fewer edge cases.
+
+
+ Instead of writing reducers, caching logic, timers, retry logic,
+ complex async/await scripting (I could keep going...), you literally
+ write a tiny fraction of the code you normally would. You will be
+ surprised at how little code you're writing or how much code you're
+ deleting when you use TanStack Query. Try it out with one of the
+ examples below!
+
+ Looking for the @tanstack/{framework}-query{' '}
+ example? We could use your help to build the{' '}
+ @tanstack/{framework}-query adapter! Join the{' '}
+
+ TanStack Discord Server
+ {' '}
+ and let's get to work!
+