Vue打包后图片路径问题

1.vue 背景图片引发的问题

在使用vue_cli时背景图片出现路径问题
需要在build文件夹的utils.js里添加 publicPath:’../../’就可以了
修改前

修改后

其中如果在行内样式中写了背景图片，这种方法是不可行的。

2.vue 在data里面引入图片引发的问题

在data中正常引入图片是这样的：

export default {
  data () {
    return {
      src: './../static/img.png'
    }
  }
 }

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

import avatar from './../static/img.png' 

export default {
  data () {
    return {
      src: avatar
    }
  }
}

//或者

export default {
  data () {
    return {
      src: require("./../static/img.png")
    }
  }
}