vue+webpack+nginx 部署在服務(wù)器非根目錄下訪問(wèn)404問(wèn)題

codergarden 發(fā)布于2019-07-25 14:09 / 2976人閱讀

摘要：最近想把所有的前端項(xiàng)目都整合在兩臺(tái)機(jī)器上，通過(guò)負(fù)載訪問(wèn)如下路徑域名域名域名這樣的方式訪問(wèn)按照平時(shí)的打包方式，直接將打包好的包放到服務(wù)器上服務(wù)器路徑并非平時(shí)的在中做好配置如下結(jié)果訪問(wèn)域名時(shí)一片紅，各種找不到困擾了好幾天，跟孫老板各種改最后終于

最近想把所有的前端項(xiàng)目都整合在兩臺(tái)機(jī)器上，通過(guò)負(fù)載訪問(wèn)如下路徑
Https://域名/gameCenter/
Https://域名/member/
Https://域名/loan/
這樣的方式訪問(wèn)

按照平時(shí)的打包方式，直接將webpack打包好的包放到服務(wù)器上
服務(wù)器路徑/H5/gameCenter(并非平時(shí)的/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;
        }

結(jié)果訪問(wèn)Https://域名/gameCenter/ 時(shí)一片紅，各種/static/js /static/css找不到

困擾了好幾天，跟孫老板各種改~

最后終于改好了，總結(jié)了以下幾點(diǎn)
1、修改config/index.js配置文件

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

3、修改router/index.js

4、修改ngnix配置

這幾個(gè)改好了，部署就沒(méi)有問(wèn)題啦~ 分享給大家

GPU云服務(wù)器云服務(wù)器訪問(wèn)出現(xiàn)404問(wèn)題 nginx404怎么解決系統(tǒng)部署在云服務(wù)器怎么訪問(wèn) 訪問(wèn)部署在云服務(wù)器的數(shù)據(jù)庫(kù)

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/39773.html

相關(guān)文章

Vue-項(xiàng)目從本地搭建到線上部署（wǒ shì biaō tí dǎng）

摘要：放置在目錄下或通過(guò)絕對(duì)路徑被引用。對(duì)于相關(guān)來(lái)說(shuō)，我們推薦使用而不是直接鏈?zhǔn)街付āＴ诓桓呐渲梦募那闆r下，前端頁(yè)面迭代發(fā)布，不需要重啟服務(wù)。作者：gauseen 0. 關(guān)于 Vuejs 簡(jiǎn)介：Vue (讀音 /vju?/，類(lèi)似于 view) 是一套用于構(gòu)建用戶界面的漸進(jìn)式框架，易用、靈活、高效。生態(tài)系統(tǒng) 項(xiàng)目介紹 awesome-vue Vue.js 相關(guān)很棒的...

Arno 2019-08-26 13:49 評(píng)論0 收藏0
vue history模式部署在服務(wù)器端的nginx配置 (非根目錄)

摘要：最終，我的解決方案如下配置如下配置路由配置該項(xiàng)目是用的所以只需要修改里面的的部分配置修改最終項(xiàng)目地址為 vue history需要nginx或者其他方式配置一下才可正確訪問(wèn)，否則路由跳轉(zhuǎn)之后刷新一下便會(huì)404 具體原因vue-router官網(wǎng)有說(shuō)明，在此不多說(shuō) 最近遇到的問(wèn)題是上了一個(gè)小的項(xiàng)目，需要放在更深層次的目錄下，上到測(cè)試環(huán)境做了官網(wǎng)提到的nginx配置發(fā)現(xiàn)不行，之后查閱了一些...

Caizhenhao 2019-08-23 13:12 評(píng)論0 收藏0
vue history模式部署在服務(wù)器端的nginx配置 (非根目錄)

摘要：最終，我的解決方案如下配置如下配置路由配置該項(xiàng)目是用的所以只需要修改里面的的部分配置修改最終項(xiàng)目地址為 vue history需要nginx或者其他方式配置一下才可正確訪問(wèn)，否則路由跳轉(zhuǎn)之后刷新一下便會(huì)404 具體原因vue-router官網(wǎng)有說(shuō)明，在此不多說(shuō) 最近遇到的問(wèn)題是上了一個(gè)小的項(xiàng)目，需要放在更深層次的目錄下，上到測(cè)試環(huán)境做了官網(wǎng)提到的nginx配置發(fā)現(xiàn)不行，之后查閱了一些...

tangr206 2019-07-25 14:30 評(píng)論0 收藏0
Vue Router history模式的配置方法及其原理

摘要：但如果要使用模式，我們需要在后端進(jìn)行額外配置。模式的配置方法我們來(lái)看看官方文檔是教我們?cè)趺磁渲玫哪Ｊ?。模式的配置?shí)踐及原理強(qiáng)烈建議閱讀這部分之前，先看一下的這部分文檔和這部分文檔。只配置前端的情況首先，我們將設(shè)置為，但不配置后端。始發(fā)于我的博客 ryougifujino.com，歡迎訪問(wèn)留言。 vue-router分為hash和history模式，前者為其默認(rèn)模式，url的表現(xiàn)形式為...

Richard_Gao 2019-08-30 11:04 評(píng)論0 收藏0
前端項(xiàng)目部署

摘要：前端項(xiàng)目部署之前很少接觸前端項(xiàng)目的部署，這次為了更全面的學(xué)習(xí)就在本機(jī)上裝了一個(gè)虛擬機(jī)上，在虛擬機(jī)上練習(xí)了如何把一個(gè)寫(xiě)的項(xiàng)目部署到這個(gè)虛擬機(jī)的服務(wù)器上。前端項(xiàng)目部署之前很少接觸前端項(xiàng)目的部署，這次為了更全面的學(xué)習(xí)就在本機(jī)上裝了一個(gè)虛擬機(jī)上，在虛擬機(jī)上練習(xí)了如何把一個(gè) react 寫(xiě)的 spa 項(xiàng)目部署到這個(gè)虛擬機(jī)的服務(wù)器上。由于 linux 也是剛接觸不久，所以整個(gè)過(guò)程還是遇到了很多...

Aceyclee 2019-07-25 14:21 評(píng)論0 收藏0