REACT路由器错误:通过netlify构建,除了主页外,无法分别加载不同的URL

发布于 2025-01-20 02:16:42 字数 417 浏览 2 评论 0原文

我对反应有些新鲜,所以我遇到了一个问题,该问题在我的个人投资组合网站上,我不知道该如何解决

问题是当我打开网站时,我将我带到我的主页上很好,当我从主页上转到其他页面时,它可以正常工作,但是当我想直接转到页面时,我就无法访问它。

例如

https://sparsh-saxena.netlify.app/ 这是我的主页,如果我以URL的方式键入此功能,它可以正常工作,

但是如果我想打开我的大约页面或投资组合上的任何其他页面,那么它就不起作用 喜欢:https://sparsh-saxena.netlify.app/about

它显示 - > 页面找不到的页面看起来您已经关注了一个折断的链接或输入本网站上不存在的URL。

任何帮助都将不胜感激

I'm a little new to react, so I have come across a problem which is on my personal portfolio website and i don't know how to solve it

the problem is when i open my website it take me to my home page which is fine, and when i go to other pages from my home page it works fine but when i want to go to about page directly than i'm unable to access it.

for example

https://sparsh-saxena.netlify.app/
this is my home page, if I type this as url it works fine

but If I want to open my about page or any other page on my portfolio than It doesn't work
like: https://sparsh-saxena.netlify.app/about

It shows-> Page Not Found Looks like you've followed a broken link or entered a URL that doesn't exist on this site.

Any help would be appreciated

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

一个人的旅程 2025-01-27 02:16:42

为了支持NetLify的客户端路由(这是您在这里的实际目标)。您需要支持PUSHSTATE

为此,您需要使用以下重写规则创建public/_redirects文件:

/* /index.html 200

现在,当您构建项目以进行部署时,它应该可以正常工作!

tl; dr:

  • public> public您的React项目文件夹中创建_redirects文件
  • 给它以下内容:/*/index.html 200
  • 构建您的项目
  • 部署以进行Netlify

In order to support client-side routing with Netlify (which is you actual objective here). You need to support pushState.

To do this you need to create a public/_redirects file with the following rewrite rules:

/* /index.html 200

Now when you build your project for deployment it should work correctly!

TL;DR:

  • create a _redirects file in your public folder of your React Project
  • give it the following content: /* /index.html 200
  • build your project
  • deploy it to Netlify
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文