Question

我已经阅读了很多教程，并查看了一些存储库，但仍然没有得到我想要的。

例如，this回购使用Cheerio（类似于服务器的jQuery）和React Helmet。

但是我想仅使用Parcel，React，ReactDOM，React Router DOM和Express来设置我的应用。

我试图在服务器上渲染组件，但这不是我想要的。我想使用hydrate函数，但不知道如何使其在服务器上呈现。 server.js看起来像这样，但是这里只呈现了一个组件，而没有其他任何东西：

import express from 'express'
import React from 'react'
import { renderToString } from 'react-dom/server'
import App from '../app/index'

const app = express()

app.get('/', (req, res) => {
    res.send(renderToString(<App/>))
})

我从教程中学到了这一点，但是它只能渲染App，但是我需要渲染很多组件！换句话说，我只需要使用Parcel设置React SSR。

我的NPM脚本来构建应用程序：

   "build-client": "parcel app/index.html -d dist/client --port 3000",
   "build-server": "parcel server/index.js -d dist/server --target node",
   "run-server": "nodemon dist/server/index.js",
   "server": "run-s build-server run-server"

很高兴看到完整的关于如何设置React SSR的仓库，除了Express和Parcel之外没有任何其他库，但是如果有任何Express的React SSR中间件插件，那么如果有人在这里共享它将会很棒。 >

使用Parcel和Express正确设置React SSR

0 个答案: