最近在研究vue,老實的按照官網提供的,搭建的了 webpack+vue+vuex+vue-router,,由於是本身搭建的,因此踩了很多坑,通常問題百度都有,這個背景圖片的問題,查了好久才解決。css
一、找到 config->index.js裏面,以下修改html
二、找到 build->utils.js,在裏面加入一句publicPath:'../../',vue
配置修改完成,接下來,使用有兩種方式,這裏通常和文件結構有關,下面是個人文件結構下的使用webpack
一、圖片資源放在 assets->img文件夾下面web
img標籤引入圖片vue-router
1
|
<img src=
"../assets/img/loginback.png"
class
=
"test-img"
/>
|
css使用圖片 vuex
1
|
background: url(
'../assets/img/loginback.png'
) no-repeat top left ;
|
二、圖片資源放在static->img文件夾下面ide
img標籤引入圖片ui
1
|
<img src=
"../../static/img/loginback.png"
class
=
"test-img"
/><br><img src=
"static/img/loginback.png"
class
=
"test-img"
/>
|
css使用圖片url
1
|
background: url(
'../../static/img/loginback.png'
) no-repeat top left ;
|