vue打包放服务器不显示图片

1.在config（文件夹）—>index.js中，添加（如图的红色标记区域）

2.在build（文件夹）—>utils.js添加

 

 3.配置完成后，在工程里静态文件存储又分为两种

（1）img css 正常引入：
          img标签引入图片    <img’ src="…/…/static/img/moon.png" class=“test-img” />
          css图片使用            background: url(’…/…/static/img/moon.png’) no-repeat top left ;
（2）从data >return 引入的图片

因为webpack是按字符号打包的，不会做任何处理。所以需要import在外部引入或者require内部引入

import avatar from './../assets/avatar.png' 
 
export default {
  data () {
    return {