diff --git a/server/index.js b/server/index.js
index af33abd..a55e018 100644
--- a/server/index.js
+++ b/server/index.js
@@ -2,6 +2,7 @@ import express from "express";
import vite from "vite";
import ssr from "./ssr.js";
+// TODO https://github.com/vitejs/vite/blob/main/packages/playground/ssr/server.js
(async () => {
const app = express();
const port = process.env.PORT || 3000;
@@ -23,7 +24,7 @@ import ssr from "./ssr.js";
next();
});
- app.use("*", ssr(viteServer.transformRequest("/src/App.jsx")));
+ app.use("*", ssr(viteServer));
// app.use(express.static("template"));
// app.use(express.static("public"));
diff --git a/server/ssr.js b/server/ssr.js
index 14a3ec3..b63c5d6 100644
--- a/server/ssr.js
+++ b/server/ssr.js
@@ -1,31 +1,41 @@
import fs from "fs";
import ReactDOMServer from "react-dom/server.js";
+import { preambleCode } from "@vitejs/plugin-react-refresh";
// import App from "/src/App";
const APP_PLACEHOLDER = "";
+const VITE_PLACEHOLDER = "";
-export default (App) => {
- console.log(App);
+export default (vite) => {
return async function ssr(req, res, next) {
- // ToDo
console.log("ssr");
const template = fs.readFileSync(process.cwd() + "/template/index.html", {
encoding: "utf-8",
});
- console.log("template", template);
const [pageBeforeApp, pageAfterApp] = template.split(APP_PLACEHOLDER);
- console.log("start", pageBeforeApp);
- res.write(pageBeforeApp);
- const stream = ReactDOMServer.renderToNodeStream((await App).code);
+ res.write(
+ pageBeforeApp.replace(
+ VITE_PLACEHOLDER,
+ `
+ `
+ )
+ );
+
+ const { render } = await vite.ssrLoadModule("/src/main-server");
+
+ // ToDo also return preload links
+ const stream = await render(req.originalUrl);
stream.pipe(res, { end: false });
stream.on("end", () => res.end(pageAfterApp));
- // const stream = ReactDOMServer.renderToString(App);
+
+ // if string
// console.log("content", stream);
// res.write(stream);
-
// res.end(pageAfterApp);
};
};
diff --git a/src/main-server.jsx b/src/main-server.jsx
new file mode 100644
index 0000000..e87df46
--- /dev/null
+++ b/src/main-server.jsx
@@ -0,0 +1,13 @@
+import React from 'react'
+import ReactDOM from 'react-dom/server'
+import './index.css'
+import App from './App'
+
+console.log('hello');
+
+export const render = (url) => ReactDOM.renderToNodeStream(
+
+
+
+);
+
diff --git a/src/main.jsx b/src/main.jsx
index 2221bb1..5b825a1 100644
--- a/src/main.jsx
+++ b/src/main.jsx
@@ -3,8 +3,7 @@ import ReactDOM from 'react-dom'
import './index.css'
import App from './App'
-console.log('hello');
-ReactDOM.render(
+ReactDOM.hydrate(
,
diff --git a/template/index.html b/template/index.html
index 6541685..bee5225 100644
--- a/template/index.html
+++ b/template/index.html
@@ -1,24 +1,14 @@
-
-
-
+
Vite App
-
-
-
+