https://blog.csdn.net/qq_34767115/article/details/95962738
vue2.5及以下版本以上兩種寫法都沒有問題, 2.6就出現這個問題,應該和webpack配置相關 .
vue2.6用的是webapack4.0(待我學習下webpack4.0的官方文檔)
也就是說在新版webpack中不管是css中還是html中內聯樣式應該使用3的方法來使用圖片
1.相對路徑: "./assets/logo_blue.png"
2.沒有前綴的路徑 "assets/logo_blue.png" 被webpack解析為 相對路徑
3.帶~的路徑 "~@/assets/theme/logo_blue.png" 被webpack解析為 require(src/assets/theme/logo_blue.png) 動態引入
@在webpack 被resolve.alias配置下等價於/src
4.相對根目錄的路徑 "/assets/logo_blue.png" webpack不解析
應當需要注意的是在public和assets中的文件表現似乎不一樣。
在js中引用圖片要使用導入的方式
data(){undefined
return {undefined
imgUrl:require("@/assets/test.png")
}
}
https://blog.csdn.net/qq_31967569/article/details/115036439