为什么我在 Hostinger 上的 ReactJS 项目在打开新选项卡或刷新页面时会出现 404 错误？

Question

我已经在 Hostinger 上部署了 ReactJS 项目，在其中打开任何新选项卡或刷新页面时都会出现错误 404

我使用了最新版本的react router dom

Index.js
<Browserrouter>
<App/>
<Browserrouter/>


App.js

<Routes>
<Route path="/" element={<Home/>}/>
        <Route path="/about-us" element={<Aboutus/>}/>
        <Route path="/contact-us" element={<Contactus/>}/>
        <Route path="/career" element={<Career/>}/>
        <Route path="/work" element={<Work/>}/> 
        <Route path="/services" element={<ServicesMain/>}/>

<Routes/>

Answer 1

问题不在于 React，而在于你的托管配置。您需要通过.htaccess使用以下代码在“public”文件夹中添加文件来添加重写规则。

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteCond %{REQUEST_FILENAME} !-l
  RewriteRule . /index.html [L]
</IfModule>