多級路由請求js文件路徑不對的解決方法

一、問題描述

最近由於項目的緣由開始學習vue，看了幾天教程而後開始擼項目。擼的過程也挺順利，擼了一個多月項目要上線的時候卻出現了問題——用history模式打開網站的時候，從導航點到具體的內容頁是正常的，可是一刷新內容頁就空白了。

好比：打開網站首頁是正常的 http://localhost:8888/ 刷新也沒問題。

經過鼠標點擊，從導航欄進入商家詳情頁的某個項目也是正常的 http://localhost:8888/Business/ResetBusiness 可是刷新下頁面就空白了。控制檯報錯以下。

點進去錯誤查看，app.js中居然都是html代碼

怎麼會這樣子，html怎麼會被打包到了js中。爲此我查了很久，感受是打包工具出了問題，可是vue-cli的打包工具很複雜，具體是哪裏，還真很差找。

後來經大佬提醒，查了下network，發現app.js的請求路徑有問題。請求路徑以下

 

這是不對的，app.js的請求路徑居然多了一個Business。而打包後的app.js是在根目錄的，若是用相對路徑請求的話，確定是請求不到的。app的正確地址就是應該是這個纔對。http://localhost:8888/app.js

2. 找緣由

發薪問題，下一步就是開始找緣由，因爲對vue的不太熟，這個過程真是耗費了很長時間，這中間也請教了不少vue的大佬，而後大佬們也沒有找到問題所在。可怕的是他們都沒有遇到過這個問題。

找了一兩天，終於被我找到緣由了。是由於以前被一篇vue教程誤導了。這個教程說要修改webpack.base.config.js 中build項的assetsPublicPath 爲相對路徑

 

坑爹啊，我想罵樓主的心都有了。那篇教程在這裏。http://www.javashuo.com/article/p-wfmhtzdr-gr.html

3.解決辦法

把assetsPublicPath 改成絕對路徑 '/' 就能夠了。 就這麼簡單。