问题

create-react-app 将安装了babel-loader的存储库初始化为旧版本而不是需要的版本.

日志:

There might be a problem with the project dependency tree.
It is likely not a bug in Create React App,
but something you need to fix locally.

The react-scripts package provided by Create React App requires a dependency:

  "babel-loader": "8.0.4"

Don't try to install it manually: your package manager does it automatically.
However, a different version of babel-loader was detected higher up in the tree:

  C:\Users\user\node_modules\babel-loader (version: 8.0.2)

Manually installing incompatible versions is known to cause …

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

例如，这个存储库使用 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/>))
})

我从教程中获取了这个，但它只渲染应用程序，但我需要渲染很多组件！换句话说，我只需要使用 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 …