vue打包後，背景圖片不顯示了
遇到的問題：開發時圖片好好的，打包後，圖片不顯示，如下圖，轉盤背景圖沒有了：
首先，說一下項目裏圖片引入的三種方式：
- 在頁面中，通過
<img src=''>路徑"屬性； - 在css文件中，通過背景圖片的
url('路徑')引入圖片； - 在js中通過
require('路徑')引入圖片；
造成圖片找不到的原因主要是：webpack打包以後，生成一個目錄/static和一個index.html文件，會改變這幾種圖片引入的路徑。
具體改變如下：
- 在頁面中和js中，改變是一樣的，直接將路徑直接改爲
‘static/img/XXX.png’，所以，如果是在頁面中或者js中引入的圖片，正常打包後，沒有問題正常顯示；
//.wheel-pointer {
// background: url("../../assets/img/draw_btn.png") no-repeat center top;
//}
//打包後如下：
.wheel-pointer[data-v-bb1116d8] {
background: url(../../static/img/draw_btn.f43e809.png) no-repeat top;
}
- 在css中，是將路徑中的文字路徑替換爲
‘static/img’，這樣替換一定會出現問題，因爲在打包好的文件中就只有兩層目錄‘../../’就不知道返回到什麼目錄下面去了；
注意url中的路徑改變，圖片展示如下，
– 打包前的樣式：
– 打包後的樣式
其原理就是不管哪種方式都去static/img下尋找圖片。
解決方案
在build/utils.js中添加好參數保存後，重新打包上傳到服務器，再運行圖片就出現了：
該文章爲記錄自己遇到的問題所用，如果有什麼錯誤，歡迎指出。
【補充】：
遇到問題：打包後的路徑少了一層項目名，導致404
解決方法：在config/index.js下的build裏，修改assetsPublicPath: '/確實的路徑name/'
參考鏈接：https://blog.csdn.net/qq_30346089/article/details/77947998
在打包即可
