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