fix: include resolve conditions in ssr conditions

+ fix some issues in examples Signed-off-by: Marc MacLeod <847542+marbemac@users.noreply.github.com>
marbemac · Jan 22, 2024 · dc4b723 · dc4b723
1 parent b9b25b3
commit dc4b723
Show file tree

Hide file tree

Showing 7 changed files with 61 additions and 61 deletions.
diff --git a/.changeset/pink-rivers-film.md b/.changeset/pink-rivers-film.md
@@ -0,0 +1,5 @@
+---
+'@ssrx/vite': patch
+---
+
+Response base resolve conditions in ssr conditions during builds. Fixes an issue with solidjs.
diff --git a/examples/bun-react-router/README.md b/examples/bun-react-router/README.md
@@ -4,9 +4,6 @@ You must have bun installed: https://bun.sh/.
 
 This example is the same as `react-router-simple`, except the server runtime (`src/server.ts`) is bun + elysia.
 
-> NOTE: at the time of this writing, Bun is not working with Vite v5 - follow
-> https://github.com/vitejs/vite/issues/14687 for updates.
-
 **Stack**
 
 - client framework: `react`

diff --git a/examples/bun-react-router/src/server.ts b/examples/bun-react-router/src/server.ts
@@ -4,38 +4,42 @@ import { renderToString } from 'react-dom/server';
 
 import * as entry from '~/entry.server.tsx';
 
-const server = new Elysia()
+const server = new Elysia();
+
+if (import.meta.env.PROD) {
   /**
    * These two serveStatic's will be used to serve production assets.
    * Vite dev server handles assets during development.
    */
-  .use(staticPlugin({ prefix: '/assets', assets: './dist/public/assets' }))
-  .get('/favicon.ico', () => Bun.file('./dist/public/favicon.ico'))
-
-  .get('*', async c => {
-    try {
-      const { app } = await entry.render(c.request);
-
-      const html = renderToString(app);
-
-      return new Response(html, {
-        headers: {
-          'Content-Type': 'text/html',
-        },
-      });
-    } catch (err) {
-      /**
-       * Handle react-router redirects
-       */
-      if (err instanceof Response && err.status >= 300 && err.status <= 399) {
-        c.set.status = err.status;
-        c.set.redirect = err.headers.get('Location') || '/';
-        return;
-      }
-
-      throw err;
+  server
+    .use(staticPlugin({ prefix: '/assets', assets: './dist/public/assets' }))
+    .get('/favicon.ico', () => Bun.file('./dist/public/favicon.ico'));
+}
+
+server.get('*', async c => {
+  try {
+    const { app } = await entry.render(c.request);
+
+    const html = renderToString(app);
+
+    return new Response(html, {
+      headers: {
+        'Content-Type': 'text/html',
+      },
+    });
+  } catch (err) {
+    /**
+     * Handle react-router redirects
+     */
+    if (err instanceof Response && err.status >= 300 && err.status <= 399) {
+      c.set.status = err.status;
+      c.set.redirect = err.headers.get('Location') || '/';
+      return;
     }
-  });
+
+    throw err;
+  }
+});
 
 const port = Number(process.env['PORT'] || 3000);
 

diff --git a/examples/react-router-records/src/server.ts b/examples/react-router-records/src/server.ts
@@ -31,7 +31,7 @@ server.get('*', async c => {
   try {
     const appStream = await serverHandler({ req: c.req.raw });
 
-    return new Response(appStream);
+    return new Response(appStream, { headers: { 'Content-Type': 'text/html' } });
   } catch (err: any) {
     /**
      * Handle react-router redirects

diff --git a/examples/solid-router-simple/src/app.tsx b/examples/solid-router-simple/src/app.tsx
@@ -3,7 +3,7 @@ import './app.css';
 import { Router } from '@solidjs/router';
 import { useRoutes } from '@solidjs/router';
 import type { JSX } from 'solid-js';
-import { Hydration, HydrationScript, NoHydration, Suspense } from 'solid-js/web';
+import { HydrationScript, Suspense } from 'solid-js/web';
 
 import { routes } from '~/routes.tsx';
 
@@ -14,26 +14,22 @@ type AppProps = {
 
 export function App({ url, head }: AppProps) {
   return (
-    <NoHydration>
-      <html lang="en">
-        <head>
-          <meta charset="utf-8" />
-          <meta name="viewport" content="width=device-width, initial-scale=1" />
-
-          {head}
-
-          <HydrationScript />
-        </head>
-
-        <body>
-          <Hydration>
-            <Router url={url}>
-              <AppContent />
-            </Router>
-          </Hydration>
-        </body>
-      </html>
-    </NoHydration>
+    <html lang="en">
+      <head>
+        <meta charset="utf-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+
+        {head}
+
+        <HydrationScript />
+      </head>
+
+      <body>
+        <Router url={url}>
+          <AppContent />
+        </Router>
+      </body>
+    </html>
   );
 }
 

diff --git a/examples/streaming-kitchen-sink/server/index.ts b/examples/streaming-kitchen-sink/server/index.ts
@@ -62,7 +62,7 @@ server
         },
       });
 
-      return new Response(appStream);
+      return new Response(appStream, { headers: { 'Content-Type': 'text/html' } });
     } catch (err: any) {
       /**
        * Handle react-router redirects

diff --git a/packages/vite/src/plugins/build.ts b/packages/vite/src/plugins/build.ts
@@ -23,7 +23,7 @@ export const buildPlugin = ({ config, router, manifest }: BuildPluginOpts): Plug
   return {
     name: `${PLUGIN_NAMESPACE}:build`,
 
-    apply(config, env) {
+    apply(c, env) {
       return env.command === 'build';
     },
 
@@ -41,13 +41,15 @@ export const buildPlugin = ({ config, router, manifest }: BuildPluginOpts): Plug
         output.entryFileNames = config.ssrOutputName;
       }
 
+      const ssrConditions = [...(c.resolve?.conditions || []), ...config.runtimeConditions];
+
       return {
         ssr: {
           target: config.ssrTarget,
           noExternal: config.ssrNoExternal,
           resolve: {
-            conditions: config.runtimeConditions,
-            externalConditions: config.runtimeConditions,
+            conditions: ssrConditions,
+            externalConditions: ssrConditions,
           },
         },
 
@@ -112,11 +114,7 @@ export const buildPlugin = ({ config, router, manifest }: BuildPluginOpts): Plug
       if (!isSsr) return;
 
       // cleanup the vite client manifest
-      if (config.viteMajor >= 5) {
-        await fs.rm(manifest.clientManifestDir, { recursive: true });
-      } else {
-        await fs.rm(manifest.clientManifestPath);
-      }
+      await fs.rm(manifest.clientManifestDir, { recursive: true });
     },
   };
 };