Самая базовая настройка SSR с помощью React 19 и API renderToPipableStream. ⇐ Javascript

[Anonymous]

Я просмотрел множество онлайн-примеров, но большинство из них, похоже, настроены с помощью React 18, хотя API кажется таким же.
В любом случае, я создали следующую настройку:


Полный код доступен GitHub здесь: https://github.com/uninstallit/basic-ssr
Чтобы запустить его:

Код: Выделить всё

pnpm install
pnpm run build
pnpm run start

Откройте браузер по адресу http://localhost:4000
Я пробовал много вариантов сервера, но с одинаковыми отрицательными результатами. Вот основной обработчик моего сервера:

Код: Выделить всё

app.use(express.static(path.resolve(__dirname, "public")));

app.get("/", (request, response) => {
console.log("request: ", request.url);

const { pipe } = renderToPipeableStream(, {
bootstrapScripts: ["main.js"],
onShellReady() {
response.setHeader("content-type", "text/html");
pipe(response);
},
onError(err) {
console.error(err);
res.status(500).send("Internal Server Error");
},
onShellError() {
response.statusCode = 500;
console.log("shell err out");
response.send("
Loading...
");
},
});
});

Когда я открываю страницу, я получаю ошибки гидратации, указывающие на внедренный код приложения.


Может кто-нибудь взглянуть и подсказать мне, где я ошибся? Или, может быть, проверьте, работает ли это на другом компьютере.

Подробнее здесь: https://stackoverflow.com/questions/793 ... stream-api