fix: support streaming ssr + rsc

Author: GiveMe-A-Name

Diff for: .vscode/settings.json

@@ -59,4 +59,5 @@
   "[javascript]": {
     "editor.defaultFormatter": "biomejs.biome"
   },
+  "todo-tree.tree.disableCompactFolders": true,
 }

Diff for: packages/runtime/plugin-runtime/package.json

@@ -232,8 +232,8 @@
     "@types/node": "^14",
     "@types/react-side-effect": "^1.1.1",
     "jest": "^29",
-    "react": "^18",
-    "react-dom": "^18",
+    "react": "18.3.0-canary-8039e6d0b-20231026",
+    "react-dom": "18.3.0-canary-8039e6d0b-20231026",
     "ts-jest": "^29.1.0",
     "typescript": "^5",
     "webpack": "^5.93.0"

Diff for: packages/runtime/plugin-runtime/src/cli/template.ts

@@ -68,7 +68,8 @@ export const index = ({
   customBootstrap?: string | false;
   mountId?: string;
 }) =>
-  `import '@${metaName}/runtime/registry/${entryName}';
+  // TODO: remove this
+  `
 ${genRenderCode({
   srcDirectory,
   internalSrcAlias,
@@ -166,6 +167,7 @@ import App from '${
       customEntry
         ? entry
             .replace('entry.tsx', 'App')
+            .replace('entry.jsx', 'App')
             .replace(srcDirectory, internalSrcAlias)
         : entry.replace(srcDirectory, internalSrcAlias).replace('.tsx', ''),
     )

Diff for: packages/runtime/plugin-runtime/src/core/server/stream/afterTemplate.ts

@@ -38,7 +38,7 @@ export function buildShellAfterTemplate(
   async function injectJs(template: string, entryName: string, nonce?: string) {
     const { routeManifest } = runtimeContext;
     const { routeAssets } = routeManifest;
-    const asyncEntry = routeAssets[`async-${entryName}`];
+    const asyncEntry = routeAssets?.[`async-${entryName}`];
     if (asyncEntry) {
       const { assets } = asyncEntry;
       const jsChunkStr = assets

Diff for: packages/runtime/plugin-runtime/src/core/server/stream/createReadableStream.ts

@@ -64,15 +64,15 @@ export const createReadableStreamFromElement: CreateReadableStreamFromElement =
                      * So we use the `SHELL_STREAM_END_MARK` to mark the shell content' tail.
                      */
                     let concatedChunk = chunkVec.join('');
-                    if (concatedChunk.includes(ESCAPED_SHELL_STREAM_END_MARK)) {
-                      concatedChunk = concatedChunk.replace(
-                        ESCAPED_SHELL_STREAM_END_MARK,
-                        '',
-                      );
-
-                      shellChunkStatus = ShellChunkStatus.FINISH;
-                      this.push(`${shellBefore}${concatedChunk}${shellAfter}`);
-                    }
+                    // if (concatedChunk.includes(ESCAPED_SHELL_STREAM_END_MARK)) {
+                    concatedChunk = concatedChunk.replace(
+                      ESCAPED_SHELL_STREAM_END_MARK,
+                      '',
+                    );
+
+                    shellChunkStatus = ShellChunkStatus.FINISH;
+                    this.push(`${shellBefore}${concatedChunk}${shellAfter}`);
+                    // }
                   } else {
                     this.push(chunk);
                   }

Diff for: packages/solutions/app-tools/src/plugins/analyze/index.ts

@@ -168,7 +168,7 @@ export default ({
 
           builder.onAfterBuild(async ({ stats }) => {
             const hookRunners = api.useHookRunners();
-            await hookRunners.afterBuild({ stats });
+            await hookRunners.afterBuild({ stats: stats as any });
             await emitResolvedConfig(appContext.appDirectory, normalizedConfig);
           });
 

Diff for: pnpm-lock.yaml

@@ -8,13 +8,19 @@ export default applyBaseConfig({
     router: false,
   },
   source: {
+    enableCustomEntry: true,
     // 避免 Modern.js 项目代码中用的是其他版本
     alias: {
-      // react$: require.resolve('react'),
+      // react$: path.resolve(__dirname, 'node_modules/react'),
       // 'react-dom/client': require.resolve('react-dom/client'),
       // 'react-dom': require.resolve('react-dom'),
     },
   },
+  server: {
+    ssr: {
+      mode: 'stream',
+    },
+  },
   tools: {
     babel(config, { modifyPresetReactOptions }) {
       modifyPresetReactOptions({

Diff for: tests/integration/basic-next-app/modern.config.ts

@@ -1,6 +1,6 @@
 {
   "private": true,
-  "name": "tmp",
+  "name": "basic-next-app",
   "version": "2.9.0",
   "scripts": {
     "dev": "BUNDLER=webpack NODE_OPTIONS='--conditions=react-server' modern dev",
@@ -21,13 +21,14 @@
     "@modern-js/runtime": "workspace:*",
     "react": "18.3.0-canary-8039e6d0b-20231026",
     "react-dom": "18.3.0-canary-8039e6d0b-20231026",
+    "react-server-dom-webpack": "18.3.0-canary-8039e6d0b-20231026",
     "marked": "4.2.12",
     "sanitize-html": "2.10.0",
     "react-error-boundary": "3.1.4",
     "pg": "8.10.0",
+    "date-fns": "^2.29.3",
     "server-only": "^0.0.1",
-    "excerpts": "0.0.3",
-    "react-server-dom-webpack": "18.3.0-canary-8039e6d0b-20231026"
+    "excerpts": "0.0.3"
   },
   "devDependencies": {
     "@modern-js/app-tools": "workspace:*",

Diff for: tests/integration/basic-next-app/package.json

@@ -10,10 +10,10 @@ import React from 'react';
 import { Pool } from 'pg';
 // import ReactApp from '../src/App';
 
-console.log('react1111111111', React.version);
-console.log('renderToReadableStream', renderToReadableStream);
+// console.log('react1111111111', React.version);
+// console.log('renderToReadableStream', renderToReadableStream);
 
-const pool = new Pool(require('../credentials'));
+// const pool = new Pool(require('../credentials'));
 
 interface IProps {
   selectedId: string;