copy一段相關(guān)說(shuō)明
首先先說(shuō)明下vue-cli的assets和static的兩個(gè)文件的區(qū)別
assets:在項(xiàng)目編譯的過(guò)程中會(huì)被webpack處理解析為模塊依賴(lài)括勺，只支持相對(duì)路徑的形式疾捍，如< img src=”./logo.png”>和background:url(./logo.png),”./logo.png”是相對(duì)資源路徑，將有webpack解析為模塊依賴(lài)
static：在這個(gè)目錄下文件不會(huì)被webpack處理,簡(jiǎn)單就是說(shuō)存放第三方文件的地方栏妖，不會(huì)被webpack解析乱豆。他會(huì)直接被復(fù)制到最終的打包目錄(默認(rèn)是dist/static)下。必須使用絕對(duì)路徑引用這些文件吊趾，這是通過(guò)config.js文件中的build.assetsPublic和build.assertsSubDirectory鏈接來(lái)確定的宛裕。任何放在static/中文件需要以絕對(duì)路徑的形式引用：/static[filename]
根據(jù)webpack的特性瑟啃，總的來(lái)說(shuō)就是static放不會(huì)變動(dòng)的，第三檔的文件揩尸，assets放可能會(huì)變動(dòng)的文件
問(wèn)題來(lái)了蛹屿，用js動(dòng)態(tài)加載assets或者本文件的圖片出現(xiàn)404的狀態(tài)碼
解決方案1，通過(guò)require加載
data () {
return {
starlist1:[
require("../assets/img/active0922/hstar.png"),
require("../assets/img/active0922/lstar.png")
],
starlist2:"../assets/img/active0922/hstar.png"
}
},
方案2岩榆，將資源防止在static目錄错负，通過(guò)/static絕對(duì)路徑使用
原因：在webpack中會(huì)將圖片圖片來(lái)當(dāng)做模塊來(lái)用，因?yàn)槭莿?dòng)態(tài)加載的勇边，所以u(píng)rl-loader將無(wú)法解析圖片地址湿颅，然后npm run dev 或者npm run build之后導(dǎo)致路徑?jīng)]有被加工【被webpack解析到的路徑都會(huì)被解析為/static/img/[filename].png，完整地址為localhost:8080/static/img/[filename].png
原文地址：http://blog.csdn.net/Mr_YanYan/article/details/78783091
