解決vue打包c(diǎn)ss文件中背景圖片的路徑問(wèn)題
更新時(shí)間:2018年09月03日 09:09:38 作者:shuhaha
今天小編就為大家分享一篇解決vue打包c(diǎn)ss文件中背景圖片的路徑問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
vue-cli寫完的靜態(tài)頁(yè)面我們?cè)趎ode環(huán)境中引入沒有問(wèn)題,但是打包后放在Apache環(huán)境下,路徑卻有問(wèn)題了
如一個(gè)簡(jiǎn)單css語(yǔ)句
.welcome { width: 420px; height: 235px; background: url(../img/welcome.jpg) 0 0 no-repeat;
但是打包后路徑成了卻出現(xiàn)404訪問(wèn)不到的問(wèn)題。
解決的辦法很簡(jiǎn)單
build路徑下utils.js文件
// Extract CSS when that option is specified
// (which is the case during production build)
if (options.extract) {
return ExtractTextPlugin.extract({
use: loaders,
fallback: 'vue-style-loader',
publicPath:'../../' //添加此代碼!??!
})
} else {
return ['vue-style-loader'].concat(loaders)
}
以上這篇解決vue打包c(diǎn)ss文件中背景圖片的路徑問(wèn)題就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
基于Vue+ElementUI的省市區(qū)地址選擇通用組件
這篇文章主要介紹了基于Vue+ElementUI的省市區(qū)地址選擇通用組件,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-11-11
詳解vue移動(dòng)端項(xiàng)目的適配(以mint-ui為例)
這篇文章主要介紹了詳解vue移動(dòng)端項(xiàng)目的適配(以mint-ui為例),小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-08-08

