Vue项目必须先执行npm run build生成dist静态文件，再放入phpEnv的www目录托管；直接放src目录无效，且history模式需配置服务器重写规则，前后端应同域部署避免跨域问题。
phpEnv 本身不运行 Vue 项目，它只提供 PHP + Web 服务器（Apache/Nginx）+ MySQL 环境；Vue 是前端框架，必须先构建为静态文件，再由 phpEnv 的 Web 服务托管。 直接把 src 目录扔进 www 下是无效的，浏览器会报错或白屏。
Vue 项目必须先执行 npm run build
这是最常被跳过的一步。Vue CLI 开发时用 npm run dev 启动的是基于 Node.js 的开发服务器（Vite/Webpack Dev Server），和 phpEnv 完全无关。生产部署必须走构建流程：
-
npm run build（Vite）或vue-cli-service build（Vue CLI）生成dist目录 -
dist内只有index.html、js/、css/等纯静态资源，无任何 Node.js 依赖 - 构建后检查
dist/index.html中的资源路径：若含/assets/xxx.js这类相对路径，需确保部署时目录结构匹配；若含/xxx.js（根路径），则需将整个dist内容放入 Web 根目录或子目录（如www/myapp/） - 构建命令默认输出到
dist，可通过vite.config.js的build.outDir或vue.config.js的outputDir修改
把 dist 放进 phpEnv 的 www 目录并配好路由
phpEnv 默认 Web 根目录是 E:\phpEnv\www\（路径以你安装位置为准）。部署方式分两种：
- 直接放根目录：复制
dist全部内容到www\，访问http://localhost/即可 - 放子目录（推荐）：新建
www\my-vue-app\，把dist内所有文件（含index.html）复制进去，访问http://localhost/my-vue-app/ - 若 Vue 使用
history模式（即 URL 不带#），必须配置 Web 服务器重写，否则刷新/about页面会 404：
– Apache：在www\my-vue-app\.htaccess中写入RewriteRule . /my-vue-app/index.html [L]（注意路径前缀）
– Nginx：在站点配置中加location / { try_files $uri $uri/ /my-vue-app/index.html; }
前后端分离时，PHP 接口与 Vue 静态文件要共域或配 CORS
Vue 项目通过 axios 请求 PHP 接口（如 /api/user.php），此时跨域是最大障碍：
Vue Composition Analyzer
下载
分析 Vue 3 Composition API 使用情况——审计响应式模式、可组合函数设计、ref 与 reactive 的选择、计算属性、watcher 使用及组件……
立即学习“PHP免费学习笔记（深入）”；
- 开发阶段：用 Vite 的
server.proxy把/api代理到http://localhost:80（phpEnv 的 Apache 端口），避免跨域 - 生产阶段（推荐）：把 PHP 接口文件（如
www\api\user.php）和 Vue 静态文件放在同一域名下，例如：
– Vue 前端访问http://localhost/my-vue-app/
– 接口请求http://localhost/api/user.php（同域，无跨域） - 若必须跨域（如前端部署在 Nginx，PHP 在 Apache），需在 PHP 接口开头加响应头：
header('Access-Control-Allow-Origin: *');，但仅限调试；正式环境应限制具体域名
phpEnv 的命令行和端口监控能快速定位启动失败
常见问题不是 Vue 本身，而是 phpEnv 服务没起来或端口被占：
- 启动失败时，phpEnv 界面右下角会弹红字错误，点开看具体日志 —— 多数是
Apache启动失败，原因常为 80 端口被 Skype、IIS 或其他软件占用 - 用 phpEnv 内置的「TCP 端口进程列表」功能，直接查谁占了 80/443/3306，右键「解除占用」比手动
netstat -ano快得多 - PHP 版本切换后，确保当前站点绑定的是已安装且启用的 PHP 版本（phpEnv 站点管理页可直观设置）
- 如果 Vue 页面加载 JS 报 404，先确认
dist中的 JS 文件名是否含哈希（如index.xxxx.js），再检查index.html中的script标签路径是否正确 —— 构建后路径错位是高频问题
真正卡住人的地方往往不在 Vue 代码，而在构建产物路径、Web 服务器重写规则、接口跨域策略这三处。phpEnv 提供的是底层容器，Vue 和 PHP 各自职责清晰，混在一起反而难排查。
