我使用background属性,设置一个div的背景为一张图片,这个图片和这个vue组件在同一个文件夹下,assetsPublicPath也从 “/” 改成了“./” ,在同一个组件中,直接使用img src的方式导入的图片打包后,没有问题,但是使用background的div图片路径错误,用f12打开观察了一下,这个背景图片和img图片的区别在于img的图片前有“./”,而背景图的图片没有。
图片html代码为:
<img src="./header.jpg">
背景图的div的css为:
background: url('./bg.jpg');
background-repeat: no-repeat;
background-position: center;
background-size: cover;
webpack打包vue项目,会把css部分提取到单独的css文件中,这样造成了图片路径引用错误,一般这种资源都是放在static目录下,然后引用('/static/...')