vite-react-ssg 0.8.3 → 0.8.5-beta.1

package/README.md

@@ -24,7 +24,9 @@ For usage examples, see: [`main`/examples/tanstack/src/main.tsx](https://github.
 - [`<ClientOnly/>`](#clientonly)
 - [Document head](#document-head)
   - [Reactive head](#reactive-head)
+- [Redirect](#redirect)
 - [Public Base Path](#public-base-path)
+- [Future config](#future-config)
 - [CSS in JS](#css-in-js)
 - [Critical CSS](#critical-css)
 - [Configuration](#configuration)
@@ -71,10 +73,10 @@ export const createRoot = ViteReactSSG(
 
 ```tsx
 // src/App.tsx
-import React from 'react'
 import type { RouteRecord } from 'vite-react-ssg'
-import './App.css'
+import React from 'react'
 import Layout from './Layout'
+import './App.css'
 
 export const routes: RouteRecord[] = [
   {
@@ -337,14 +339,44 @@ export default function MyHead() {
 }
 ```
 
+## Redirect
+
+You should not use redirect in the loader.
+In vite-react-ssg, the loader only executes during the build process for data fetching.
+If you need to perform a redirect in certain situations, you can use the following method to redirect on the client side:
+
+```tsx
+export const routes: RouteRecord[] = [
+  {
+    path: '/:lng',
+    Component: Layout,
+    getStaticPaths: () => Object.keys(resources),
+    children: [
+      // ... some routes
+    ],
+  },
+  {
+    path: '/',
+    Component: () => {
+      const navigate = useNavigate()
+      useEffect(() => {
+        navigate('/en', { replace: true })
+      }, [navigate])
+
+      return null
+    },
+  },
+]
+```
+
 ## Public Base Path
 
 Just set `base` in vite.config.ts like:
 
 ```ts
+import react from '@vitejs/plugin-react-swc'
 // vite.config.ts
 import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react-swc'
 
 // https://vitejs.dev/config/
 export default defineConfig({
@@ -616,11 +648,8 @@ export default defineConfig({
 
 ## Roadmap
 
-- [x] Preload assets
-- [x] Document head
-- [x] SSR in dev environment
-- [x] More Client components, such as `<ClientOnly />`
-- [x] `getStaticPaths` for dynamic routes
+- [ ] Support `react19`
+- [ ] no index.html mode
 
 ## Credits
 

package/dist/client/single-page.d.mts

@@ -1,9 +1,9 @@
 import { ReactNode } from 'react';
-import { V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from '../shared/vite-react-ssg.Di0pROyF.mjs';
-export { C as CrittersOptions, I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, c as RouterFutureConfig, d as RouterOptions, S as StyleCollector, b as ViteReactSSGOptions } from '../shared/vite-react-ssg.Di0pROyF.mjs';
-export { C as ClientOnly, H as Head } from '../shared/vite-react-ssg.Cm9gBlfg.mjs';
-import 'react-router-dom';
+import { V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from '../shared/vite-react-ssg.BrImbdZU.mjs';
+export { C as CrittersOptions, I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, c as RouterFutureConfig, d as RouterOptions, S as StyleCollector, b as ViteReactSSGOptions } from '../shared/vite-react-ssg.BrImbdZU.mjs';
+export { C as ClientOnly, H as Head } from '../shared/vite-react-ssg.-NlgsPvg.mjs';
 import 'beasties';
+import 'react-router-dom';
 import 'react-helmet-async';
 
 declare function ViteReactSSG(App: ReactNode, fn?: (context: ViteReactSSGContext<false>) => Promise<void> | void, options?: ViteReactSSGClientOptions): (client?: boolean, routePath?: string) => Promise<ViteReactSSGContext<false>>;

package/dist/client/single-page.d.ts

@@ -1,9 +1,9 @@
 import { ReactNode } from 'react';
-import { V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from '../shared/vite-react-ssg.Di0pROyF.js';
-export { C as CrittersOptions, I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, c as RouterFutureConfig, d as RouterOptions, S as StyleCollector, b as ViteReactSSGOptions } from '../shared/vite-react-ssg.Di0pROyF.js';
-export { C as ClientOnly, H as Head } from '../shared/vite-react-ssg.Cm9gBlfg.js';
-import 'react-router-dom';
+import { V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from '../shared/vite-react-ssg.BrImbdZU.js';
+export { C as CrittersOptions, I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, c as RouterFutureConfig, d as RouterOptions, S as StyleCollector, b as ViteReactSSGOptions } from '../shared/vite-react-ssg.BrImbdZU.js';
+export { C as ClientOnly, H as Head } from '../shared/vite-react-ssg.-NlgsPvg.js';
 import 'beasties';
+import 'react-router-dom';
 import 'react-helmet-async';
 
 declare function ViteReactSSG(App: ReactNode, fn?: (context: ViteReactSSGContext<false>) => Promise<void> | void, options?: ViteReactSSGClientOptions): (client?: boolean, routePath?: string) => Promise<ViteReactSSGContext<false>>;

package/dist/client/single-page.mjs

@@ -1,7 +1,7 @@
 import { jsx } from 'react/jsx-runtime';
 import { HelmetProvider } from 'react-helmet-async';
-import { r as render, h as hydrate, d as documentReady } from '../shared/vite-react-ssg.CfJcpdWF.mjs';
-export { C as ClientOnly, H as Head } from '../shared/vite-react-ssg.CfJcpdWF.mjs';
+import { r as render, h as hydrate, d as documentReady } from '../shared/vite-react-ssg.Dx4ca9OM.mjs';
+export { C as ClientOnly, H as Head } from '../shared/vite-react-ssg.Dx4ca9OM.mjs';
 import { d as deserializeState } from '../shared/vite-react-ssg.C6pK7rvr.mjs';
 import 'react';
 import 'react-dom';
@@ -13,7 +13,7 @@ function ViteReactSSG(App, fn, options = {}) {
     ssrWhenDev,
     getStyleCollector = null
   } = options;
-  if (process.env.NODE_ENV === "development" && ssrWhenDev !== void 0)
+  if (process.env.NODE_ENV === "development" && ssrWhenDev !== undefined)
     console.warn("[vite-react-ssg] `ssrWhenDev` option is no longer needed. If you want to use csr, just replace `vite-react-ssg dev` with `vite`.");
   const isClient = typeof window !== "undefined";
   async function createRoot(client = false, routePath) {
@@ -31,8 +31,8 @@ function ViteReactSSG(App, fn, options = {}) {
       transformState,
       routePath,
       getStyleCollector,
-      routes: void 0,
-      routerOptions: void 0,
+      routes: undefined,
+      routerOptions: undefined,
       base: "/",
       app: App,
       routerType: "single-page"
@@ -56,7 +56,8 @@ function ViteReactSSG(App, fn, options = {}) {
           console.warn("[vite-react-ssg] Root container not found.");
         return;
       }
-      await createRoot(true);
+      const context = await createRoot(true);
+      window.__VITE_REACT_SSG_CONTEXT__ = context;
       const app = /* @__PURE__ */ jsx(HelmetProvider, { children: App });
       const isSSR = document.querySelector("[data-server-rendered=true]") !== null;
       if (!isSSR && process.env.NODE_ENV === "development") {

package/dist/index.d.mts

@@ -1,12 +1,18 @@
-import { d as RouterOptions, V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from './shared/vite-react-ssg.Di0pROyF.mjs';
-export { C as CrittersOptions, I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, c as RouterFutureConfig, S as StyleCollector, b as ViteReactSSGOptions } from './shared/vite-react-ssg.Di0pROyF.mjs';
-export { C as ClientOnly, H as Head } from './shared/vite-react-ssg.Cm9gBlfg.mjs';
-import React from 'react';
+import { V as ViteReactSSGContext, d as RouterOptions, a as ViteReactSSGClientOptions } from './shared/vite-react-ssg.BrImbdZU.mjs';
+export { C as CrittersOptions, I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, c as RouterFutureConfig, S as StyleCollector, b as ViteReactSSGOptions } from './shared/vite-react-ssg.BrImbdZU.mjs';
+export { C as ClientOnly, H as Head } from './shared/vite-react-ssg.-NlgsPvg.mjs';
 import { LinkProps, NavLinkProps } from 'react-router-dom';
+import React from 'react';
 import 'beasties';
 import 'react-helmet-async';
 
+/**
+ * @deprecated Please use `Link` from 'react-router-dom' instead.
+ */
 declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>;
+/**
+ * @deprecated Please use `NavLink` from 'react-router-dom' instead.
+ */
 declare const NavLink: React.ForwardRefExoticComponent<NavLinkProps & React.RefAttributes<HTMLAnchorElement>>;
 
 declare function ViteReactSSG(routerOptions: RouterOptions, fn?: (context: ViteReactSSGContext<true>) => Promise<void> | void, options?: ViteReactSSGClientOptions): (client?: boolean, routePath?: string) => Promise<ViteReactSSGContext<true>>;
@@ -14,6 +20,7 @@ declare global {
     interface Window {
         __VITE_REACT_SSG_STATIC_LOADER_DATA__: any;
         __VITE_REACT_SSG_HASH__: string;
+        __VITE_REACT_SSG_CONTEXT__: ViteReactSSGContext<true>;
     }
 }
 

package/dist/index.d.ts

@@ -1,12 +1,18 @@
-import { d as RouterOptions, V as ViteReactSSGContext, a as ViteReactSSGClientOptions } from './shared/vite-react-ssg.Di0pROyF.js';
-export { C as CrittersOptions, I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, c as RouterFutureConfig, S as StyleCollector, b as ViteReactSSGOptions } from './shared/vite-react-ssg.Di0pROyF.js';
-export { C as ClientOnly, H as Head } from './shared/vite-react-ssg.Cm9gBlfg.js';
-import React from 'react';
+import { V as ViteReactSSGContext, d as RouterOptions, a as ViteReactSSGClientOptions } from './shared/vite-react-ssg.BrImbdZU.js';
+export { C as CrittersOptions, I as IndexRouteRecord, N as NonIndexRouteRecord, R as RouteRecord, c as RouterFutureConfig, S as StyleCollector, b as ViteReactSSGOptions } from './shared/vite-react-ssg.BrImbdZU.js';
+export { C as ClientOnly, H as Head } from './shared/vite-react-ssg.-NlgsPvg.js';
 import { LinkProps, NavLinkProps } from 'react-router-dom';
+import React from 'react';
 import 'beasties';
 import 'react-helmet-async';
 
+/**
+ * @deprecated Please use `Link` from 'react-router-dom' instead.
+ */
 declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>;
+/**
+ * @deprecated Please use `NavLink` from 'react-router-dom' instead.
+ */
 declare const NavLink: React.ForwardRefExoticComponent<NavLinkProps & React.RefAttributes<HTMLAnchorElement>>;
 
 declare function ViteReactSSG(routerOptions: RouterOptions, fn?: (context: ViteReactSSGContext<true>) => Promise<void> | void, options?: ViteReactSSGClientOptions): (client?: boolean, routePath?: string) => Promise<ViteReactSSGContext<true>>;
@@ -14,6 +20,7 @@ declare global {
     interface Window {
         __VITE_REACT_SSG_STATIC_LOADER_DATA__: any;
         __VITE_REACT_SSG_HASH__: string;
+        __VITE_REACT_SSG_CONTEXT__: ViteReactSSGContext<true>;
     }
 }
 

package/dist/index.mjs

@@ -1,11 +1,11 @@
 import { jsx } from 'react/jsx-runtime';
 import { HelmetProvider } from 'react-helmet-async';
 import { useLinkClickHandler, Link as Link$1, NavLink as NavLink$1, matchRoutes, createBrowserRouter, RouterProvider } from 'react-router-dom';
-import { r as render, h as hydrate, d as documentReady } from './shared/vite-react-ssg.CfJcpdWF.mjs';
-export { C as ClientOnly, H as Head } from './shared/vite-react-ssg.CfJcpdWF.mjs';
-import { d as deserializeState } from './shared/vite-react-ssg.C6pK7rvr.mjs';
+import { r as render, h as hydrate, d as documentReady } from './shared/vite-react-ssg.Dx4ca9OM.mjs';
+export { C as ClientOnly, H as Head } from './shared/vite-react-ssg.Dx4ca9OM.mjs';
 import { j as joinUrlSegments, w as withLeadingSlash, s as stripBase } from './shared/vite-react-ssg.CjIppNIS.mjs';
-import { c as convertRoutesToDataRoutes } from './shared/vite-react-ssg.C0y5wbxl.mjs';
+import { c as convertRoutesToDataRoutes } from './shared/vite-react-ssg.C_MPXL9p.mjs';
+import { d as deserializeState } from './shared/vite-react-ssg.C6pK7rvr.mjs';
 import React, { forwardRef } from 'react';
 import 'react-dom';
 
@@ -79,16 +79,16 @@ function ViteReactSSG(routerOptions, fn, options = {}) {
     ssrWhenDev,
     getStyleCollector = null
   } = options;
-  if (process.env.NODE_ENV === "development" && ssrWhenDev !== void 0)
+  if (process.env.NODE_ENV === "development" && ssrWhenDev !== undefined)
     console.warn("[vite-react-ssg] `ssrWhenDev` option is no longer needed. If you want to use csr, just replace `vite-react-ssg dev` with `vite`.");
   const isClient = typeof window !== "undefined";
   const BASE_URL = routerOptions.basename ?? "/";
-  const { v7_startTransition, ...routerFeature } = routerOptions.future ?? {};
+  const { v7_startTransition = true, ...routerFeature } = routerOptions.future ?? {};
   async function createRoot(client = false, routePath) {
     const browserRouter = client ? createBrowserRouter(
       convertRoutesToDataRoutes(routerOptions.routes, transformStaticLoaderRoute),
       { basename: BASE_URL, future: routerFeature }
-    ) : void 0;
+    ) : undefined;
     const appRenderCallbacks = [];
     const onSSRAppRendered = client ? () => {
     } : (cb) => appRenderCallbacks.push(cb);
@@ -135,11 +135,13 @@ function ViteReactSSG(routerOptions, fn, options = {}) {
         await Promise.all(
           lazeMatches.map(async (m) => {
             const routeModule = await m.route.lazy();
-            Object.assign(m.route, { ...routeModule, lazy: void 0 });
+            Object.assign(m.route, { ...routeModule, lazy: undefined });
           })
         );
       }
-      const { router } = await createRoot(true);
+      const context = await createRoot(true);
+      window.__VITE_REACT_SSG_CONTEXT__ = context;
+      const { router } = context;
       const app = /* @__PURE__ */ jsx(HelmetProvider, { children: /* @__PURE__ */ jsx(RouterProvider, { router, future: { v7_startTransition } }) });
       const isSSR = document.querySelector("[data-server-rendered=true]") !== null;
       if (!isSSR && process.env.NODE_ENV === "development") {

package/dist/node/cli.mjs

@@ -1,22 +1,22 @@
 import { gray, bold, red, reset, underline } from 'kolorist';
 import yargs from 'yargs';
 import { hideBin } from 'yargs/helpers';
-import { b as build, d as dev } from '../shared/vite-react-ssg.BgawrvuJ.mjs';
+import { b as build, d as dev } from '../shared/vite-react-ssg.2P3UhU88.mjs';
 import { Headers, Request, Response, fetch, FormData } from '@remix-run/web-fetch';
-import 'node:path';
 import 'node:module';
-import 'p-queue';
+import 'node:path';
 import 'fs-extra';
-import 'vite';
 import 'jsdom';
-import '../shared/vite-react-ssg.C6pK7rvr.mjs';
+import 'p-queue';
+import 'vite';
 import '../shared/vite-react-ssg.CjIppNIS.mjs';
+import '../shared/vite-react-ssg.C6pK7rvr.mjs';
 import 'react/jsx-runtime';
 import 'react-helmet-async';
+import 'node:events';
 import 'node:stream';
+import '../shared/vite-react-ssg.C_MPXL9p.mjs';
 import 'react-dom/server';
-import 'node:events';
-import '../shared/vite-react-ssg.C0y5wbxl.mjs';
 import '../shared/vite-react-ssg.B-j07kW6.mjs';
 
 function installGlobals() {
@@ -47,7 +47,7 @@ yargs(hideBin(process.argv)).scriptName("vite-react-ssg").usage("$0 [args]").com
     describe: "The base path to render"
   }),
   async (args) => {
-    const { config: configFile = void 0, ...ssgOptions } = args;
+    const { config: configFile = undefined, ...ssgOptions } = args;
     await build(ssgOptions, { configFile });
   }
 ).command(
@@ -72,7 +72,7 @@ yargs(hideBin(process.argv)).scriptName("vite-react-ssg").usage("$0 [args]").com
     describe: "The host to expose"
   }),
   async (args) => {
-    const { config: configFile = void 0, host, ...ssgOptions } = args;
+    const { config: configFile = undefined, host, ...ssgOptions } = args;
     await dev(ssgOptions, { configFile, server: { host } });
   }
 ).fail((msg, err, yargs2) => {

package/dist/node.d.mts

@@ -1,8 +1,8 @@
 import { InlineConfig } from 'vite';
-import { b as ViteReactSSGOptions } from './shared/vite-react-ssg.Di0pROyF.mjs';
+import { b as ViteReactSSGOptions } from './shared/vite-react-ssg.BrImbdZU.mjs';
+import 'beasties';
 import 'react';
 import 'react-router-dom';
-import 'beasties';
 
 declare function build(ssgOptions?: Partial<ViteReactSSGOptions>, viteConfig?: InlineConfig): Promise<void>;
 

package/dist/node.d.ts

@@ -1,8 +1,8 @@
 import { InlineConfig } from 'vite';
-import { b as ViteReactSSGOptions } from './shared/vite-react-ssg.Di0pROyF.js';
+import { b as ViteReactSSGOptions } from './shared/vite-react-ssg.BrImbdZU.js';
+import 'beasties';
 import 'react';
 import 'react-router-dom';
-import 'beasties';
 
 declare function build(ssgOptions?: Partial<ViteReactSSGOptions>, viteConfig?: InlineConfig): Promise<void>;
 

package/dist/node.mjs

@@ -1,17 +1,17 @@
-export { b as build, d as dev } from './shared/vite-react-ssg.BgawrvuJ.mjs';
-import 'node:path';
+export { b as build, d as dev } from './shared/vite-react-ssg.2P3UhU88.mjs';
 import 'node:module';
+import 'node:path';
+import 'fs-extra';
+import 'jsdom';
 import 'kolorist';
 import 'p-queue';
-import 'fs-extra';
 import 'vite';
-import 'jsdom';
-import './shared/vite-react-ssg.C6pK7rvr.mjs';
 import './shared/vite-react-ssg.CjIppNIS.mjs';
+import './shared/vite-react-ssg.C6pK7rvr.mjs';
 import 'react/jsx-runtime';
 import 'react-helmet-async';
+import 'node:events';
 import 'node:stream';
+import './shared/vite-react-ssg.C_MPXL9p.mjs';
 import 'react-dom/server';
-import 'node:events';
-import './shared/vite-react-ssg.C0y5wbxl.mjs';
 import './shared/vite-react-ssg.B-j07kW6.mjs';

package/dist/shared/{vite-react-ssg.Cm9gBlfg.d.ts → vite-react-ssg.-NlgsPvg.d.mts}

@@ -1,15 +1,15 @@
-import { ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 import { HelmetProps } from 'react-helmet-async';
 
+interface ClientOnlyProps {
+    children?: () => React.ReactNode;
+    fallback?: React.ReactNode;
+}
+declare function ClientOnly({ children, fallback, }: ClientOnlyProps): React.ReactNode | null;
+
 type Props = HelmetProps & {
     children: ReactNode;
 };
-declare function Head(props: Props): JSX.Element;
-
-interface ClientOnlyProps {
-    children?: () => JSX.Element;
-    fallback?: JSX.Element;
-}
-declare function ClientOnly({ children, fallback, }: ClientOnlyProps): JSX.Element | null;
+declare function Head(props: Props): React.ReactNode;
 
 export { ClientOnly as C, Head as H };

package/dist/shared/{vite-react-ssg.Cm9gBlfg.d.mts → vite-react-ssg.-NlgsPvg.d.ts}

@@ -1,15 +1,15 @@
-import { ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 import { HelmetProps } from 'react-helmet-async';
 
+interface ClientOnlyProps {
+    children?: () => React.ReactNode;
+    fallback?: React.ReactNode;
+}
+declare function ClientOnly({ children, fallback, }: ClientOnlyProps): React.ReactNode | null;
+
 type Props = HelmetProps & {
     children: ReactNode;
 };
-declare function Head(props: Props): JSX.Element;
-
-interface ClientOnlyProps {
-    children?: () => JSX.Element;
-    fallback?: JSX.Element;
-}
-declare function ClientOnly({ children, fallback, }: ClientOnlyProps): JSX.Element | null;
+declare function Head(props: Props): React.ReactNode;
 
 export { ClientOnly as C, Head as H };