多个 VUE 前端工程部署设置、nginx 代理配置
多个 VUE 前端工程部署设置、nginx 代理配置
微风-- 轻许--
发布于 2019-05-25 19:44:38
发布于 2019-05-25 19:44:38
版权声明：这可是本菇凉辛辛苦苦原创的，转载请一定带上我家地址，不要忘记了哈 . https://cloud.tencent.com/developer/article/1433199
PS：早期 我只有一个 VUE 前端工程：gentle-vue ，加一个 java 后端工程：gentle ，比较好部署。
现在有 2 个 前端工程 （后端工程也有多个）
前后端工程部署方式都是docker ，这个和早期一样，无需改动。
前后端分离工程实现见文章：前后端分离工程实现 （VUE、JAVA）、附全部源码
单独 VUE工程、java 工程的 docker 方式部署见文章：
Docker 方式 部署 vue 项目 （docker + vue + nginx）
Docker 部署应用、jar 工程 docker 方式部署
多个 VUE 前端工程部署、nginx 代理配置：
- 预期效果
前端工程 gentle-vue 访问地址：http://ergouzi.fun/gentle-vue/
前端工程 breeze 访问地址：http://ergouzi.fun/
- 在 VUE 工程中有 3 个地方要设置。
1） config --> index.js --> build 中 设置访问路径：
2）router --> index.js 中设置：
3）index.html 的 <head> 中 新增：<meta base=/gentle-vue/>
前端工程 gentle 的设置就可以了。再有更多则同样设置即可。
- nginx 配置：
到此时 前端工程 gentle 已经可以访问到了。
我的另外一个前端工程是直接放在域名路径下，所以不用作 第 2 步中的设置。只要有第 3 步中的代理，前端工程 breeze 就可以访问到了。
4 . 访问效果：
gentle工程：
breeze 工程：
OK了。
本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2019年05月24日，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读