vue項目 webpack打包后,圖片路徑是絕對路徑


vue項目,使用webpack打包,雖然在全局把路徑改成了相對的路徑,但是圖片引用的路徑還是異常的,解決辦法如下:

1、config文件夾下index.js中:

assetsPublicPath:"./"

背景圖片的引用問題

上面雖然解決了資源路徑的引用問題,但是資源里面的背景圖片,不像index.html中加載資源一樣,通過./static/js/app.js引用可以正常加載,圖片資源是通過css加載的,如 background: url("../../assets/images/logo-index.png") no-repeat;被相對打包后變成了url(static/img/logo-index.2f00bf2.png) no-repeat所以我們要保留css引用圖片的正常路徑,即:

url(../../static/img/logo-index.2f00bf2.png) no-repeat

那么就需要修改build文件夾下的utils.js代碼,如圖所示:

 

 
       


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM