Я хочу попробовать серверную визуализацию в React, но мой код не работает.
Я должен что-то упустить. Но я не знаю, что это такое, потому что я новичок, чтобы реагировать.
Вот и код:
сервер / приложение. js
import express from 'express';
import { renderToString } from 'react-dom/server';
import Home from '../src/index.js';
const app = express();
const content = renderToString(<Home />);
app.get('/', function (req, res) {
res.send(
`
<html>
<head>
<title>ssr</title>
</head>
<body>
<div id="root">${content}</div>
</body>
</html>
`
);
})
app.listen(3001, () => {
console.log('listen:3001')
})
src / index. js
import React from 'react';
const Home = () => {
return (
<div>
<div>Hello World</div>
</div>
)
}
export default Home
пакет. json
{
"scripts": {
"start": "nodemon --exec babel-node server/app.js"
}
}
.babelr c
{
"presets": [
"env"
],
"plugins": []
}