【无标题】

vue-cil4 + 项目 图片路径 打包问题

  <!-- 这样引入背景图片时,由于静态路径不会被编译处理,所以在项目运行起来或者项目打包编译之后按照此处../assets/img/bg.png路径无法找到图片 -->
  <div style="background-image: url('../assets/img/bg.png');"></div>
  <!-- 如果图片放在static路径下,则可以直接这样引入,引入static下的文件不会被打包编译" -->
  <div style="background-image: url('static/img/bg.png');"></div>

public/static
不会被编译打包 原封不动移动到dist/目录下

assets/
目录下文件会被编译打包,图片小于10k会被转base64

对于背景图片

background:url(‘/public/static/img/logo.png’)

写在css中会经过编译 打包到dist/img目录下 源文件也会存在 所以会增加打包之后的文件大小
写在行内则不会经过编译

推荐写在行内 这样打包之后的文件会小一点


版权声明:本文为Change_xiao原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。