React Router 5.0.0在Webpack生产构建中失败（不变失败：您不应在<router>之外使用<route>）

Question

我开始了一个新的宠物项目，设置webpack进行响应，以便更好地了解webpack的工作，我的目标是设置服务器端渲染和客户端渲染

在开发模式下可以正常工作，但是在生产模式下，在服务器端渲染React元素时出现错误

不变式失败：您不应在<路由器>

之外使用路由

必须与webpack优化代码有关，但我无法指出

反应路由器4.2.0正常运行，但是使用反应路由器5.0.0则无法正常工作。 我尝试了其他解决方案，例如

• 仅使用反应路由器
• 从react-router import {StaticRouter} from "react-router"导入静态路由器

但没有任何效果，我在github上建立了一个仓库

https://github.com/RachitKalra/react-setup

只需安装节点依赖项，然后在开发模式下运行npm debug，在生产模式下运行npm start（导致错误）

预先感谢，我现在在这里停留了一段时间

Invariant failed: You should not use <Route> outside a <Router>
Error: Invariant failed: You should not use <Route> outside a <Router>
    at invariant (D:\Work\react-setup\node_modules\tiny-invariant\dist\tiny-invariant.cjs.js:13:11)
    at Object.children (D:\Work\react-setup\node_modules\react-router\cjs\react-router.js:454:21)
    at a.render (D:\Work\react-setup\www-start:310:64)
    at a.read (D:\Work\react-setup\www-start:307:58)

Answer 1

您的router-wrapper中正在从StaticRouter导入react-router-dom，但是此软件包不会导出StaticRouter。

您必须从react-router导入它。

import { StaticRouter } from "react-router";
import { BrowserRouter } from "react-router-dom";