首先，vue项目有两个地方可以存放静态资源。一个是assets文件夹，一个是static文件夹（地址栏输入static可以直接访问）。放到static里面webpack打包后只会把资源复制到发布目录而不会把小图片优化为base64。而assets内的资源会被webpack打包,比如图片,会被转为BASE64。为了兼顾图片资源优化，所以还是不适合把图片资源放到static。
而当我们把这些资源放入assets文件夹时，当引入的图片是背景图片时，会报错。
<img src="@/assets/logo.png" alt="">
.bg {
width: 100px;
height: 200px;
background: url('~@/assets/logo.png')
}
这个时候，还需配置build => util.js 里找到ExtractTextPlugin.extract增加一行：publicPath: '../../'，主要解决背景图片路径的问题。
return ExtractTextPlugin.extract({
use: loaders,
fallback: 'vue-style-loader',
publicPath: '../../'
})
这样改动的原因是Vue打包完成的目录结构中，js/css文件与static目录的层级差了2级
作者：苏瑾诺
链接：https://www.jianshu.com/p/c57d50dcf1c5
来源：简书
