From b682a9cb9f1013e73c70e75b4b349f5eb1903dc7 Mon Sep 17 00:00:00 2001
From: Daishi Kato <dai-shi@users.noreply.github.com>
Date: Sat, 15 Jul 2023 17:33:40 +0900
Subject: [PATCH] feat: use node-loader again (#103)

* feat: use node-loader again

* update CHANGELOG

* missing RSDW node-loader

* update docs
---
 CHANGELOG.md                           |  1 +
 README.md                              |  2 +-
 package.json                           |  5 +++++
 src/lib/builder.ts                     | 14 --------------
 src/lib/middleware/rsc/worker-api.ts   |  9 ++++++++-
 src/lib/middleware/rsc/worker-impl.ts  |  5 -----
 src/node-loader.ts                     | 11 +++++++++++
 website/src/routes/docs/installing.tsx |  2 +-
 8 files changed, 27 insertions(+), 22 deletions(-)
 create mode 100644 src/node-loader.ts

diff --git a/CHANGELOG.md b/CHANGELOG.md
index d5ca8555e..6949365c9 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,7 @@
 ## [Unreleased]
 ### Changed
 - fix: partially for css modules #98
+- feat: use node-loader again #103
 
 ## [0.13.0] - 2023-07-06
 ### Changed
diff --git a/README.md b/README.md
index 8ea1f3bae..9040de29c 100644
--- a/README.md
+++ b/README.md
@@ -21,7 +21,7 @@ yarn create waku
 ```
 
 ```bash
-pnpm create waku # pnpm not working for now
+pnpm create waku
 ```
 
 ## Work in progress
diff --git a/package.json b/package.json
index 67529593b..00e126552 100644
--- a/package.json
+++ b/package.json
@@ -15,6 +15,11 @@
       "require": "./dist/cjs/main.js",
       "default": "./dist/main.js"
     },
+    "./node-loader": {
+      "types": "./dist/node-loader.d.ts",
+      "require": "./dist/cjs/node-loader.js",
+      "default": "./dist/node-loader.js"
+    },
     "./config": {
       "types": "./dist/config.d.ts",
       "require": "./dist/cjs/config.js",
diff --git a/src/lib/builder.ts b/src/lib/builder.ts
index a934c8e0d..9b90e462a 100644
--- a/src/lib/builder.ts
+++ b/src/lib/builder.ts
@@ -59,11 +59,6 @@ const analyzeEntries = async (entriesFile: string) => {
         (id) => serverEntryFileSet.add(id)
       ),
     ],
-    ssr: {
-      noExternal: /^(?!node:)/,
-      // FIXME this is very adhoc.
-      external: ["react", "minimatch"],
-    },
     resolve: {
       conditions: ["react-server"],
     },
@@ -103,15 +98,6 @@ const buildServerBundle = async (
 ) => {
   const serverBuildOutput = await viteBuild({
     ...configFileConfig,
-    ssr: {
-      noExternal: Object.values(clientEntryFiles).map(
-        // FIXME this might not work with pnpm
-        (fname) =>
-          path
-            .relative(path.join(config.root, "node_modules"), fname)
-            .split("/")[0]!
-      ),
-    },
     resolve: {
       conditions: ["react-server"],
     },
diff --git a/src/lib/middleware/rsc/worker-api.ts b/src/lib/middleware/rsc/worker-api.ts
index 4c70bb48f..58722a887 100644
--- a/src/lib/middleware/rsc/worker-api.ts
+++ b/src/lib/middleware/rsc/worker-api.ts
@@ -10,7 +10,14 @@ import type {
 } from "../../../server.js";
 
 const worker = new Worker(new URL("worker-impl.js", import.meta.url), {
-  execArgv: ["--conditions", "react-server"],
+  execArgv: [
+    "--experimental-loader",
+    "waku/node-loader",
+    "--experimental-loader",
+    "react-server-dom-webpack/node-loader",
+    "--conditions",
+    "react-server",
+  ],
 });
 
 export type BuildOutput = {
diff --git a/src/lib/middleware/rsc/worker-impl.ts b/src/lib/middleware/rsc/worker-impl.ts
index f6858dab9..73658fc78 100644
--- a/src/lib/middleware/rsc/worker-impl.ts
+++ b/src/lib/middleware/rsc/worker-impl.ts
@@ -108,11 +108,6 @@ const vitePromise = viteCreateServer({
       parentPort!.postMessage(mesg);
     }),
   ],
-  ssr: {
-    noExternal: /^(?!node:)/,
-    // FIXME this is very adhoc.
-    external: ["react", "minimatch", "react-server-dom-webpack"],
-  },
   resolve: {
     conditions: ["react-server"],
   },
diff --git a/src/node-loader.ts b/src/node-loader.ts
new file mode 100644
index 000000000..c98b6db9f
--- /dev/null
+++ b/src/node-loader.ts
@@ -0,0 +1,11 @@
+export async function load(url: string, context: any, nextLoad: any) {
+  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;
+}
diff --git a/website/src/routes/docs/installing.tsx b/website/src/routes/docs/installing.tsx
index 54d526733..c4606eb1c 100644
--- a/website/src/routes/docs/installing.tsx
+++ b/website/src/routes/docs/installing.tsx
@@ -2,7 +2,7 @@ import { CodeBlock } from "../../components/Code.js";
 
 const code1 = `npm create waku@latest
 yarn create waku
-pnpm create waku # pnpm not working for now`;
+pnpm create waku`;
 
 export default function Layout() {
   return (