react 项目打包二级目 使用BrowserRouter 解决页面刷新404 找不到路由

使用BrowserRouter

package 配置 (这部分代码可以不做配置也能实现)

复制代码
{
 "homepage": "/admin",
 }

vite.config 配置

复制代码
export default defineConfig({

	base: '/admin'

])

BrowserRouter 添加配置项

复制代码
<BrowserRouter basename='/admin'>
  <App />
</BrowserRouter>

nginx配置

复制代码
server {
  listen       80;
  server_name  www.demo.com;
  root         /var/www;
  index        index.html;
  location /admin{
    try_files $uri /admin/index.html;  # 重点,这里不是配置文件夹名称,而是代理路径名称
  }
}
相关推荐
OPHKVPS15 分钟前
黑客反被黑:研究人员利用 XSS 漏洞劫持 StealC 控制面板,窃取攻击者情报
前端·网络·npm
whyfail1 小时前
Pretext:告别DOM重排,让文本布局飞起来
前端·dom
楚轩努力变强1 小时前
2026 年前端破局:从页面开发到前端隐私计算全链路架构师,构建原生数据安全合规体系
前端·国密算法·数据安全合规·前端安全·web crypto api·前端隐私计算·2026前端趋势
敲敲了个代码1 小时前
React 那么多状态管理库,到底选哪个?如果非要焊死一个呢?这篇文章解决你的选择困难症
前端·javascript·学习·react.js·前端框架
yungcy61631 小时前
React性能优化实战:从卡顿到丝滑,15个核心技巧覆盖全场景
前端·react.js·性能优化
阿珊和她的猫1 小时前
React 中 CSS 书写方式全解析
前端·css·react.js
打瞌睡的朱尤2 小时前
js复习--考核
开发语言·前端·javascript
前端极客探险家2 小时前
React 全面入门与进阶实战教程
前端·javascript·react.js
网络安全学习库2 小时前
很喜欢Vue,但还是选择了React: AI时代的新考量
vue.js·人工智能·react.js·小程序·aigc·产品经理·ai编程