vue-cli3版本的项目，public资源下img目录内png在线上404

Question

问题描述

我在本地将png图片资源放置在public目录下的img文件夹内，然后在div标签内的style属性中，background图片资源引入使用了url('/img/xxx.png')的方式，本地启服务，图片资源可以正常显示。

<div style="background: url('/img/wedding.png') no-repeat; background-size: cover;"></div>

但是发布到线上，则图片资源404...

因为刚接触前端和vue不久，所以还望各位大虾指点一下迷津。

Answer 1

换成相对路径
../../public/img

Answer 2

检查一下线上 是否是域名的跟目录，如果是子路径的话，静态资源就存在找不到的情况。

需要添加子路径地址。如子路径为/e/;那么线上访问地址应该为:

<div style="background: url('/e/img/wedding.png') no-repeat; background-size: cover;"></div>