美文网首页前端开发总结
vue项目打包后css背景图路径不对的问题

vue项目打包后css背景图路径不对的问题

作者: 泪滴在琴上 | 来源:发表于2019-10-25 15:27 被阅读0次

    css代码中背景图片是根据相对路径来写的,如下图:

    QQ截图20191025152431.png
    当使用npm run dev命令本地访问的时候,背景图片是正常显示的,可使用npm run build命令打包后,访问dist目录下的项目,页面背景图路径就不对了,显示不出背景图。
    使用npm run build命令打包之后,访问dist目录下的文件,出现的问题,背景图片路径变成了http://127.0.0.1:9000/static/css/static/img/login-bg.0271ef1.jpeg,而实际在dist目录下,图片路径是这样的
    解决办法为:只需要在build/utils.js文件中添加如下一行代码即可。
    publicPath:'../../'
    
    QQ截图20191025152637.png

    相关文章

      网友评论

        本文标题:vue项目打包后css背景图路径不对的问题

        本文链接:https://www.haomeiwen.com/subject/bygsvctx.html