From 2add568286e6cad3ead50c9edc4d7e4a03771825 Mon Sep 17 00:00:00 2001
From: Tobbe Lundberg <tobbe@tlundberg.com>
Date: Thu, 27 Jul 2023 21:03:40 +0200
Subject: [PATCH] RSC: Use experimental node loader (#8979)

Use experimental node loaders when launching the RSC FE Server

This is all done to try to make loading of 3rd party modules work.
Specifically have been experimenting with the `server-only` package.

In the end it turned out that it's not working because there's a
bug/missing feature in Vite
https://github.com/vitejs/vite/pull/13487
---
 packages/cli/src/commands/serveBothHandler.js |  2 ++
 packages/vite/package.json                    |  8 +++++
 packages/vite/src/buildRscFeServer.ts         |  3 ++
 packages/vite/src/waku-lib/node-loader.ts     | 34 +++++++++++++++++++
 4 files changed, 47 insertions(+)
 create mode 100644 packages/vite/src/waku-lib/node-loader.ts

diff --git a/packages/cli/src/commands/serveBothHandler.js b/packages/cli/src/commands/serveBothHandler.js
index ea37ad298545..28ace745bbcf 100644
--- a/packages/cli/src/commands/serveBothHandler.js
+++ b/packages/cli/src/commands/serveBothHandler.js
@@ -64,6 +64,8 @@ export const bothRscServerHandler = async (argv) => {
   const fePromise = execa(
     'node',
     [
+      '--experimental-loader @redwoodjs/vite/node-loader',
+      '--experimental-loader @redwoodjs/vite/react-node-loader',
       '--conditions react-server',
       './node_modules/@redwoodjs/vite/dist/runRscFeServer.js',
     ],
diff --git a/packages/vite/package.json b/packages/vite/package.json
index 92f0395b8ffa..b6d7e91ecbb1 100644
--- a/packages/vite/package.json
+++ b/packages/vite/package.json
@@ -37,6 +37,14 @@
     "./buildFeServer": {
       "types": "./dist/buildFeServer.d.ts",
       "default": "./dist/buildFeServer.js"
+    },
+    "./node-loader": {
+      "types": "./dist/waku-lib/node-loader.d.ts",
+      "default": "./dist/waku-lib/node-loader.js"
+    },
+    "./react-node-loader": {
+      "types": "./dist/react-server-dom-webpack/node-loader.d.ts",
+      "default": "./dist/react-server-dom-webpack/node-loader.js"
     }
   },
   "bin": {
diff --git a/packages/vite/src/buildRscFeServer.ts b/packages/vite/src/buildRscFeServer.ts
index 078346566233..77f26d0d0643 100644
--- a/packages/vite/src/buildRscFeServer.ts
+++ b/packages/vite/src/buildRscFeServer.ts
@@ -39,6 +39,9 @@ export const buildRscFeServer = async ({
     // configFile: viteConfigPath,
     root: webSrc,
     plugins: [react(), rscIndexPlugin()],
+    resolve: {
+      conditions: ['react-server'],
+    },
     build: {
       outDir: webDist,
       emptyOutDir: true, // Needed because `outDir` is not inside `root`
diff --git a/packages/vite/src/waku-lib/node-loader.ts b/packages/vite/src/waku-lib/node-loader.ts
new file mode 100644
index 000000000000..9be77626fc64
--- /dev/null
+++ b/packages/vite/src/waku-lib/node-loader.ts
@@ -0,0 +1,34 @@
+// This loader is needed to make react-server-dom-webpack/node-loader work.
+// Without it we get the following error:
+//
+// resolve ./dist/node/index.js {
+//   conditions: [ 'node', 'import', 'node-addons', 'react-server' ],
+//   importAssertions: [Object: null prototype] {},
+//   parentURL: 'file:///Users/tobbe/tmp/rw-rsc-esm/node_modules/vite/index.cjs'
+// }
+// (node:33561) DeprecationWarning: Obsolete loader hook(s) supplied and will be ignored: getSource, transformSource
+// /Users/tobbe/tmp/rw-rsc-esm/node_modules/@redwoodjs/vite/dist/react-server-dom-webpack/node-loader.js:357
+//       throw new Error('Expected source to have been loaded into a string.');
+//             ^
+
+// Error: Expected source to have been loaded into a string.
+//     at load (/Users/tobbe/tmp/rw-rsc-esm/node_modules/@redwoodjs/vite/dist/react-server-dom-webpack/node-loader.js:357:13)
+//     at async nextLoad (node:internal/modules/esm/loader:163:22)
+
+export async function load(url: string, context: any, nextLoad: any) {
+  // console.log('waku-lib/node-loader: load', context.format, url)
+
+  const result = await nextLoad(url, context, nextLoad)
+
+  if (result.format === 'module') {
+    let { source } = result
+
+    if (typeof source !== 'string') {
+      source = source.toString()
+    }
+
+    return { ...result, source }
+  }
+
+  return result
+}