Timestamp: {data.timestamp ? new Date(data.timestamp).toLocaleTimeString('en-US') : 'N/A'}
return (
-
sdf3
-
List - Version {version}
+
sdf32323232
+ {tm}
+ {version === '2.0.0' &&
}
+ {/*
List - Version {version}
*/}
+ {/*
List - Version2 {version + 1}
*/}
Primary Button
diff --git a/src/pages/a/main.tsx b/src/pages/a/main.tsx
index ea94803..4acbcef 100644
--- a/src/pages/a/main.tsx
+++ b/src/pages/a/main.tsx
@@ -8,7 +8,8 @@ type ServerData = {
async function fetchServerData() {
await new Promise(resolve => setTimeout(resolve, 1000));
return {
- version: '3.0.0',
+ // version: '3.0.0' + Math.floor(Math.random() * 100),
+ version: '2.0.0',
timestamp: Date.now(),
innerHtml: '
Inner HTML Content
'
};
@@ -27,6 +28,6 @@ export const getData = fetchServerData; // 导出数据获取函数，供 server
// Server Component - 通过 props 接收数据，不再自己 fetch
export default async function ServerApp(props: { data: ServerData }) {
return <>
-
+
}
diff --git a/src/server-node.tsx b/src/server-node.tsx
index 8ad1a71..694dbc5 100644
--- a/src/server-node.tsx
+++ b/src/server-node.tsx
@@ -3,7 +3,7 @@ import Main, { createServerDataScript, getData } from './pages/a/main.tsx';
import http from 'http';
import fs from 'fs';
import path from 'path';
-
+import fg from 'fast-glob'
const PORT = 3000;
const distDir = path.join(process.cwd(), 'dist');
const indexHtmlPath = path.join(process.cwd(), 'dist/index.html');
@@ -19,10 +19,24 @@ const mimeTypes: Record
= {
'.ico': 'image/x-icon',
};
+const indexList = fg.globSync('index-*.js', {
+ cwd: process.cwd() + '/dist',
+})
+const indexPath = indexList.map(file => {
+ const basename = path.basename(file, '.js');
+ const [_, hash] = basename.split('-');
+ console.log('Found index file:', `http://localhost:${PORT}/${basename}`);
+ return { file, hash, basename };
+});
-async function ssrRender(res: http.ServerResponse, mode: 'server' | 'client' = 'client') {
+async function ssrRender(res: http.ServerResponse, opts: {
+ mode: 'server' | 'client',
+ urlPath: string,
+ filename?: string
+}) {
let template: string;
+ const mode = opts.mode || 'client';
try {
template = fs.readFileSync(indexHtmlPath, 'utf-8');
} catch {
@@ -30,7 +44,7 @@ async function ssrRender(res: http.ServerResponse, mode: 'server' | 'client' = '
res.end('dist/index.html not found');
return;
}
- if (mode === 'client' ) {
+ if (mode === 'client') {
res.writeHead(200, { 'Content-Type': 'text/html' });
res.end(template);
return;
@@ -38,19 +52,21 @@ async function ssrRender(res: http.ServerResponse, mode: 'server' | 'client' = '
try {
const serverData = await getData()
+ const filename = opts.filename;
+ const bootstrapScripts = [filename]
+ const scriptTag = bootstrapScripts.map(src => ``).join('');
const stream = await renderToReadableStream(, {
- bootstrapScripts: []
});
let renderedHtml = '';
for await (const chunk of stream) {
renderedHtml += new TextDecoder().decode(chunk);
}
-
- // console.log('Rendered HTML:', renderedHtml);
+ console.log('Rendered HTML:', renderedHtml);
const html = template
.replace('', `${renderedHtml}
`)
- .replace('', `${createServerDataScript(serverData)}`);
+ .replace('', `${createServerDataScript(serverData)}`)
+ .replace('