允许 expess 将路由传递给 react-router

Question

我正在开发一个 express webpack react / react router 应用程序 (^2.0.0-rc5)。在 express 中，我使用 app.use(express.static(path.join(__dirname, 'dist'))); 将我的 React 应用程序映射到 url。

当我在我的应用程序中转到 http://localhost:3001/ 时，它导航正常。然后当我点击按钮 Link 进入 http://localhost:3001/diff-place 时，它导航到新页面。

然而，当我直接进入 http://localhost:3001/diff-place 时，express 拦截请求并发出 404。

我不确定如何解决这个问题，所以欢迎任何建议。

Answer 1

在您的快速路由的末尾，确保您定义了一个 catch all 路由，该路由将为任何页面请求加载客户端，并确保将示例中的 index.html 替换为您的 html 入口点是。届时 react-router 将启动。

app.get('*', function(req, res) {
  res.sendFile(path.resolve(__dirname + 'dist/index.html'));
});

允许 expess 将路由传递给 react-router

Allowing expess to pass routes to react-router

express

reactjs

react-router