解决方法一:
Nginx 配置
{
listen 80 ;
listen [::]:80 ;
root /usr/local/react/build;
location / {
try_files $uri $uri/ /index.html;
}
}
解决方法二:
BrowserRouter 换成 HashRouter
import React from 'react';
import ReactDOM from 'react-dom/client';
import {HashRouter} from 'react-router-dom'
import App from './App';
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<HashRouter>
<App />
</HashRouter>
);
原因
本地运行,URL为真实的URL,BrowserRouter 可以直接访问到真实 URL。
但是项目打包后,当页面刷新或跳转新页面时,客户端浏览器会向服务器请求URL。
服务器会去找build文件夹下的html文件,发现找不到URL指定的路径。
这是因为实际上并没有这样的物理路径,或者没有配置路由请求,所以内容无法显示,而显示404错误。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)