Netlify Reactjs React Router 上的“页面未找到”错误已解决

至此，您已经创建了一个单页应用程序，它在本地 npm 或 yarn 服务器上运行良好。现在，您构建了这个网站并将其部署到Netlify上。

不...我收到错误。

页面未找到

看起来您点击了无效的链接或输入了此站点上不存在的 URL。

许多人在使用 React Router 到Netlify部署单页 React 站点后可能会遇到以下错误。

错误是如何发生的？

React Router 在客户端（浏览器）处理路由，因此当您访问非根页面（例如https://yoursite.netlify.com/login）时，Netlify（服务器端）不知道如何处理该路由。

（因为您的路由是在根级别设置的）。

当您直接转到 Netlify 时，会发生错误https://<netlify domain>/route。

我们怎样才能解决这个问题？

Netlify 提供了一个特殊文件_redirects，您可以将其添加到您的代码库中，并让 Netlify 处理客户端未处理的 URL。

Netlify 文档中有一个部分 “历史推送状态和单页应用程序”，它向您展示了如何重定向到 SPA URL 的根目录（但没有提到 React Router，因为它适用于其他客户端框架/库）。

因此，为了解决这个问题，我们需要创建一个名为_redirects我们网站根目录 [App 的公共文件夹] 的文件，其中包含以下内容。

/* /index.html 200

在 github 上查看文件

这是工作示例站点：带有 firebase 身份验证的 React Todo App。

有关重定向的更多方式和限制，请查看 Netlify 官方文档。

资源

• 我在《歌唱密码》中找到了答案。
• _redirects Netlify SPA 文档。
• 带有文件的源代码_redirects。
• 带有 _redirects 文件的Netlify 站点。

帖子“Netlify Reactjs React Router 上的页面未找到错误已解决”首先出现在Rajesh Royal上。