Vue 項目(HTML5 History 模式) 部署服務器


history路由404配置

后端配置:

https://router.vuejs.org/zh/guide/essentials/history-mode.html#%E5%90%8E%E7%AB%AF%E9%85%8D%E7%BD%AE%E4%BE%8B%E5%AD%90

一、前端配置:
①、router配置--指定路由起始(在開發模式中,Vue項目被放在了webpack配合nodeJs生成的本地服務器的根目錄,但是在真實服務器中,項目肯定不會放在根目錄,所以要指定router的base)


 
router

提前和后端商量好項目部署的服務器文件夾路徑

②、編譯打包配置
進入config --> index.js


 
build

③、使用npm run build進行打包,至此前端能做的配置已經做完

二、后端配置:
路由跳轉出現404,主要原因是后端對這個虛擬的前端路由沒有做任何處理,服務器在找不到指定路徑下的資源時,只能向客戶端返回404。
解決辦法(Apache):進行url重寫 --- 將Vue項目所在服務器文件夾下的路徑,例如:
leibo.group/pcMall/.... 重寫為 leibo.group/pcMall/index.html
leibo.group/app/.... 重寫為 leibo.group/app/index.html

 
.hatccess

具體的Apache開啟allowoverride ,url重寫,后端分分鍾就解決了
如果是其他類型服務器


作者:雷波_viho
鏈接:https://www.jianshu.com/p/a770f52be23c
來源:簡書
著作權歸作者所有。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM