From 6f5a9d7b15110b3d4bb69160fbcc85b19ac48aee Mon Sep 17 00:00:00 2001
From: 9aoy <gaoyuan.1226@bytedance.com>
Date: Mon, 2 Dec 2024 11:07:59 +0800
Subject: [PATCH] chore: enhance ssr manifest example (#182)

---
 .../rsbuild.config.mjs                        |  3 ---
 rsbuild/ssr-express-with-manifest/server.mjs  | 21 +++++++++++++++----
 2 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/rsbuild/ssr-express-with-manifest/rsbuild.config.mjs b/rsbuild/ssr-express-with-manifest/rsbuild.config.mjs
index e25f5352..6f2eb084 100644
--- a/rsbuild/ssr-express-with-manifest/rsbuild.config.mjs
+++ b/rsbuild/ssr-express-with-manifest/rsbuild.config.mjs
@@ -3,9 +3,6 @@ import { pluginReact } from "@rsbuild/plugin-react";
 
 export default defineConfig({
   plugins: [pluginReact()],
-  dev: {
-    writeToDisk: true 
-  },
   environments: {
     web: {
       output: {
diff --git a/rsbuild/ssr-express-with-manifest/server.mjs b/rsbuild/ssr-express-with-manifest/server.mjs
index be9f79db..1c22777f 100644
--- a/rsbuild/ssr-express-with-manifest/server.mjs
+++ b/rsbuild/ssr-express-with-manifest/server.mjs
@@ -4,17 +4,23 @@ import { createRsbuild, loadConfig, logger } from "@rsbuild/core";
 
 const templateHtml = fs.readFileSync('./template.html', 'utf-8');
 
+let manifest;
+
 const serverRender = (serverAPI) => async (_req, res) => {
   const indexModule = await serverAPI.environments.ssr.loadBundle("index");
 
   const markup = indexModule.render();
 
-  const { entries } = JSON.parse(fs.readFileSync('./dist/manifest.json', 'utf-8'));
+  const { entries } = JSON.parse(manifest);
 
-  const { js, css } = entries['index'].initial;
+  const { js = [], css = []} = entries['index'].initial;
 
-  const scriptTags = js.map(file => `<script src="${file}" defer></script>`).join('\n');
-  const styleTags = css.map(file => `<link rel="stylesheet" href="${file}">`).join('\n');  
+  const scriptTags = js
+    .map((url) => `<script src="${url}" defer></script>`)
+    .join('\n');
+  const styleTags = css
+    .map((file) => `<link rel="stylesheet" href="${file}">`)
+    .join('\n');
 
   const html = templateHtml.replace("<!--app-content-->", markup).replace('<!--app-head-->', `${scriptTags}\n${styleTags}`);
 
@@ -32,6 +38,11 @@ export async function startDevServer() {
     rsbuildConfig: content,
   });
 
+  rsbuild.onDevCompileDone(async () => {
+    // update manifest info when rebuild
+    manifest = await fs.promises.readFile('./dist/manifest.json', 'utf-8');
+  })
+
   const app = express();
 
   // Create Rsbuild DevServer instance
@@ -54,6 +65,8 @@ export async function startDevServer() {
   const httpServer = app.listen(rsbuildServer.port, () => {
     // Notify Rsbuild that the custom server has started
     rsbuildServer.afterListen();
+
+    console.log(`Server started at http://localhost:${rsbuildServer.port}`);
   });
 
   rsbuildServer.connectWebSocket({ server: httpServer });