
直接结论:phpEnv 自带的 Nginx 默认不处理前端路由 fallback,必须手动修改其 nginx.conf 或站点配置文件,加入 try_files $uri $uri/ /index.html; 才能解决刷新 404。
为什么 phpEnv 下 Vue/React 刷新必现 404
phpEnv 是 Windows 下集成 PHP + Nginx + MySQL 的轻量环境,它的 Nginx 配置默认按传统多页应用设计:只服务真实存在的文件或目录。而 Vue/React 使用 history 模式时,/user/profile 这类路径在磁盘上并不存在,Nginx 查不到对应文件就直接返回 404 —— 和线上服务器行为一致,只是本地容易误以为“本该自动支持”。
常见错误现象:
- 首页
/能打开,点导航跳转到/admin也正常 - 但在
/admin页面按 F5 刷新 → 显示 “404 Not Found”(Nginx 原生错误页) - Network 面板里能看到
GET /admin返回 404,而非加载index.html
改哪几个地方?关键三步
phpEnv 的 Nginx 配置通常位于 phpEnv\nginx\conf\nginx.conf,或更推荐——在 phpEnv\nginx\vhosts\ 下为你的站点单独建配置文件(如 my-vue.conf),避免污染主配置。
Orderly React SDK 钩子使用参考指南,包括 useOrderEntry、usePositionStream、useOrderbookStream、useCollateral 等。
立即学习“PHP免费学习笔记(深入)”;
实操要点:
- 确保
root指向构建产物的**父目录**,例如项目 build 输出在D:\www\myapp\dist,则写root D:/www/myapp;(注意 Windows 路径用正斜杠或双反斜杠) - 在
location / { ... }块内添加try_files $uri $uri/ /dist/index.html;—— 这里用/dist/index.html是因为root指的是父目录,Nginx 会拼成D:/www/myapp/dist/index.html - 如果项目部署在子路径(如
http://localhost/myapp/),需同步设置:
– Vue 侧:在vue.config.js中加publicPath: '/myapp/'
– React 侧:在package.json中设"homepage": "/myapp/"
– Nginx 侧:用location /myapp/ { alias D:/www/myapp/dist/; try_files $uri $uri/ /myapp/index.html; }
容易被忽略的坑:Windows 路径与大小写
phpEnv 在 Windows 上运行,路径处理比 Linux 更敏感:
-
alias末尾必须带斜杠(alias D:/www/myapp/dist/;),否则静态资源如/static/js/app.js会 404 -
root路径中不要混用单反斜杠\,Nginx 解析可能失败;统一用/或// - 检查
index.html文件名是否真为小写 —— Windows 文件系统不区分大小写,但 Nginx 配置里写成/INDEX.HTML会导致 fallback 失败 - 改完配置后务必执行
nginx -t(在 phpEnv 的 nginx 目录下)验证语法,再nginx -s reload生效
最常卡住的地方不是 try_files 本身,而是 root 或 alias 指向和实际文件结构对不上 —— 多看一眼 error.log(位于 phpEnv\nginx\logs\error.log)里 “open() failed” 的那行路径,基本就能定位错在哪一级。


















