vue+webpack+nginx 部署在服务器非根目录下访问404问题

codergarden 发布于2019-07-25 14:09 / 2936人阅读

摘要：最近想把所有的前端项目都整合在两台机器上，通过负载访问如下路径域名域名域名这样的方式访问按照平时的打包方式，直接将打包好的包放到服务器上服务器路径并非平时的在中做好配置如下结果访问域名时一片红，各种找不到困扰了好几天，跟孙老板各种改最后终于

最近想把所有的前端项目都整合在两台机器上，通过负载访问如下路径
Https://域名/gameCenter/
Https://域名/member/
Https://域名/loan/
这样的方式访问

按照平时的打包方式，直接将webpack打包好的包放到服务器上
服务器路径/H5/gameCenter(并非平时的/gameCenter)

在ngnix中做好配置如下：

location  ^~ /gameCenter/{
                alias /H5/gameCenter/;
                try_files $uri $uri/ /gameCenter/index.html;
                gzip on;
                gzip_types application/javascript text/css image/jpeg image/png;
        }

结果访问Https://域名/gameCenter/ 时一片红，各种/static/js /static/css找不到

困扰了好几天，跟孙老板各种改~

最后终于改好了，总结了以下几点
1、修改config/index.js配置文件

2、修改build/webpack.prod.conf.js配置文件

3、修改router/index.js

4、修改ngnix配置

这几个改好了，部署就没有问题啦~ 分享给大家

云服务器 GPU云服务器访问出现404问题 nginx404怎么解决系统部署在云服务器怎么访问访问部署在云服务器的数据库

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/39773.html

Vue-项目从本地搭建到线上部署（wǒ shì biaō tí dǎng）

摘要：放置在目录下或通过绝对路径被引用。对于相关来说，我们推荐使用而不是直接链式指定。在不更改配置文件的情况下，前端页面迭代发布，不需要重启服务。作者：gauseen 0. 关于 Vuejs 简介：Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架，易用、灵活、高效。生态系统项目介绍 awesome-vue Vue.js 相关很棒的...

Arno 2019-08-26 13:49 评论0 收藏0
vue history模式部署在服务器端的nginx配置 (非根目录)

摘要：最终，我的解决方案如下配置如下配置路由配置该项目是用的所以只需要修改里面的的部分配置修改最终项目地址为 vue history需要nginx或者其他方式配置一下才可正确访问，否则路由跳转之后刷新一下便会404 具体原因vue-router官网有说明，在此不多说最近遇到的问题是上了一个小的项目，需要放在更深层次的目录下，上到测试环境做了官网提到的nginx配置发现不行，之后查阅了一些...

Caizhenhao 2019-08-23 13:12 评论0 收藏0
vue history模式部署在服务器端的nginx配置 (非根目录)

摘要：最终，我的解决方案如下配置如下配置路由配置该项目是用的所以只需要修改里面的的部分配置修改最终项目地址为 vue history需要nginx或者其他方式配置一下才可正确访问，否则路由跳转之后刷新一下便会404 具体原因vue-router官网有说明，在此不多说最近遇到的问题是上了一个小的项目，需要放在更深层次的目录下，上到测试环境做了官网提到的nginx配置发现不行，之后查阅了一些...

tangr206 2019-07-25 14:30 评论0 收藏0
Vue Router history模式的配置方法及其原理

摘要：但如果要使用模式，我们需要在后端进行额外配置。模式的配置方法我们来看看官方文档是教我们怎么配置的模式。模式的配置实践及原理强烈建议阅读这部分之前，先看一下的这部分文档和这部分文档。只配置前端的情况首先，我们将设置为，但不配置后端。始发于我的博客 ryougifujino.com，欢迎访问留言。 vue-router分为hash和history模式，前者为其默认模式，url的表现形式为...

Richard_Gao 2019-08-30 11:04 评论0 收藏0
前端项目部署

摘要：前端项目部署之前很少接触前端项目的部署，这次为了更全面的学习就在本机上装了一个虚拟机上，在虚拟机上练习了如何把一个写的项目部署到这个虚拟机的服务器上。前端项目部署之前很少接触前端项目的部署，这次为了更全面的学习就在本机上装了一个虚拟机上，在虚拟机上练习了如何把一个 react 写的 spa 项目部署到这个虚拟机的服务器上。由于 linux 也是刚接触不久，所以整个过程还是遇到了很多...

Aceyclee 2019-07-25 14:21 评论0 收藏0