解決vue-cli 配置資源引用的絕對路徑問題
更新時間：2022年09月09日 16:31:21 作者：linefate
這篇文章主要介紹了vue-cli 配置資源引用的絕對路徑的問題，本文通過圖文實例相結(jié)合給大家介紹的非常詳細，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下
1、在vue項目中，我們經(jīng)常需要引用圖片等資源，每次用相對路徑來說太麻煩
2、于是將要解決在vue-cli下搭建的項目配置絕對路徑的位置
配置如下：
在項目中的build文件夾下的webpack.base.conf.js中進行配置(配置詳情如上圖)
在項目中使用配置好的絕對路徑如下：
使用~加上你配置的絕對路徑的路徑名就可以在項目中使用了
如上我配置的絕對路徑名：F:/travel-vue-h5/src/assets/mages/紫霞.jpg
我配置的路徑如下：
'assets': resolve('src/assets/')該路徑的絕對路徑名我就叫做assets
使用的時候直接
<img src="~assets/images/紫霞.jpg" alt="">
解決！！??！
到此這篇關(guān)于vue-cli 配置資源引用的絕對路徑的文章就介紹到這了,更多相關(guān)vue-cli 配置資源內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要為大家詳細介紹了vue2.0多條件搜索組件的實現(xiàn)方法，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-05-05
這篇文章主要介紹了vue地址欄直接輸入路由無效問題的解決，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-11-11
這篇文章主要介紹了淺談vue中$event理解和框架中在包含默認值外傳參，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08
這篇文章主要介紹了webstorm添加*.vue文件支持，webstorm很多的插件內(nèi)置，不用安裝插件，下面嘗試用vue和es6做項目，有興趣的可以了解一下2018-05-05
這篇文章主要介紹了vm.$attrs使用場景詳解，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-03-03
本篇文章主要介紹了vue語法之拼接字符串的示例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-10-10
這篇文章主要介紹了Vue-Ant Design Vue-普通及自定義校驗實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-10-10
Vue3 封裝 element-plus 圖標選擇器實現(xiàn)步驟
這篇文章主要介紹了Vue3 封裝 element-plus 圖標選擇器,本文通過實例代碼給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2023-09-09
這篇文章主要介紹了如何通過點擊按鈕切換顯示不同echarts圖表，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-10-10
跨域是指當一個資源去訪問另一個不同域名或者同域名不同端口的資源時,就會發(fā)出跨域請求,下面這篇文章主要給大家介紹了關(guān)于vue使用vite配置跨域以及環(huán)境配置的相關(guān)資料,需要的朋友可以參考下2022-07-07