本人在開始學習vue的過程中,雖然比較容易上手,還是碰到了很多坑,比如我今天要說的VUE的部署問題。我在部署vue的過程中發現自己在開發環境中,頁面什么都可以跑起來,但是npm dev build后發現好多問題就出來了,比如圖片的路徑問題,訪問的路徑問題。
1、圖片路徑問題:個人覺的把所有的靜態圖片可以放入static文件夾下面,本身這個文件夾我們在搭vue腳手架的時候就已經生成了,從這個名稱就可以知道它改存放那些資源。對於靜態資源應用的方式我是這樣處理的,在webpack.base.conf文件中,把這個資源映射成為全局的到時候就不會存在圖片調用不到的問題,我的解決方式如下圖所示
2、部署到服務器訪問路徑的解決方式,我是這樣進行處理的打開vue的config下的index文件 修改生成環境的路徑,這塊我也是搜索過很多網上資料得到的結果,這樣你可以把你build出來的dist文件整個丟到服務里,比如用的是tomcat
,把文件丟到tomcat下,文件夾可以重新命名,假設我文件夾命名為myvue,tomcat端口號我們配置為8080,我們部署完成訪問http://ip:8080/myvue,就可以直接訪問了,還一個地方需要改,我是參考網上寫的方法,修改build下的utils,在generateLoaders方法里面加個publicPath節點,如截圖所示
這塊我是參照網上的一個別人寫的東西,也解決了我的這個問題,非常感謝,附上鏈接地址https://segmentfault.com/q/1010000009642018