replace Start prerender with Vite SPA
All checks were successful
CI / Typecheck, test & build (push) Successful in 3m54s
CI / Deploy to Cloudflare Workers (push) Successful in 1m51s

This commit is contained in:
2026-08-31 01:28:48 +08:00
parent 848de4e309
commit 6932906327
10 changed files with 58 additions and 513 deletions

17
src/main.tsx Normal file
View File

@ -0,0 +1,17 @@
import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'
import { RouterProvider } from '@tanstack/react-router'
import { getRouter } from './router'
import './styles.css'
const rootElement = document.getElementById('root')
if (!rootElement) {
throw new Error('Root element not found')
}
createRoot(rootElement).render(
<StrictMode>
<RouterProvider router={getRouter()} />
</StrictMode>,
)

View File

@ -701,12 +701,3 @@ const rootRouteChildren: RootRouteChildren = {
export const routeTree = rootRouteImport
._addFileChildren(rootRouteChildren)
._addFileTypes<FileRouteTypes>()
import type { getRouter } from './router.tsx'
import type { createStart } from '@tanstack/react-start'
declare module '@tanstack/react-start' {
interface Register {
ssr: true
router: Awaited<ReturnType<typeof getRouter>>
}
}

View File

@ -1,6 +1,5 @@
import { createRouter as createTanStackRouter } from '@tanstack/react-router'
import { QueryClient } from '@tanstack/react-query'
import { setupRouterSsrQueryIntegration } from '@tanstack/react-router-ssr-query'
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
import { routeTree } from './routeTree.gen'
export function getRouter() {
@ -24,10 +23,11 @@ export function getRouter() {
scrollRestoration: true,
defaultPreload: 'intent',
defaultPreloadStaleTime: 0,
Wrap: ({ children }) => (
<QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
),
})
setupRouterSsrQueryIntegration({ router, queryClient })
return router
}

View File

@ -1,45 +1,20 @@
import {
HeadContent,
Outlet,
Scripts,
createRootRouteWithContext,
} from '@tanstack/react-router'
import { Outlet, createRootRouteWithContext } from '@tanstack/react-router'
import type { QueryClient } from '@tanstack/react-query'
import { Toaster } from '@/components/ui/sonner'
import appCss from '../styles.css?url'
const THEME_INIT_SCRIPT = `(function(){try{var stored=window.localStorage.getItem('theme');var prefersDark=window.matchMedia('(prefers-color-scheme: dark)').matches;var resolved=stored==='dark'||(stored!=='light'&&prefersDark)?'dark':'light';document.documentElement.classList.toggle('dark',resolved==='dark');document.documentElement.style.colorScheme=resolved;}catch(e){}})();`
interface RouterContext {
queryClient: QueryClient
}
export const Route = createRootRouteWithContext<RouterContext>()({
head: () => ({
meta: [
{ charSet: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
{ title: 'Gig 管理后台' },
],
links: [{ rel: 'stylesheet', href: appCss }],
}),
shellComponent: RootDocument,
component: () => <Outlet />,
component: RootComponent,
})
function RootDocument({ children }: { children: React.ReactNode }) {
function RootComponent() {
return (
<html lang="zh-CN" suppressHydrationWarning>
<head>
<script dangerouslySetInnerHTML={{ __html: THEME_INIT_SCRIPT }} />
<HeadContent />
</head>
<body className="font-sans antialiased">
{children}
<Toaster position="top-center" richColors />
<Scripts />
</body>
</html>
<>
<Outlet />
<Toaster position="top-center" richColors />
</>
)
}