Vue 中项目中静态图片不显示问题

下面说两种情况：

1、data中定义的图片，页面中显示时 ,应该这样定义：

 iconImg: require('../../static/img/tab1Gray.png')；

2、页面中动态获取的静态图片也要注意；

<img v-if="index<3" :src='../../static/images/no' + index + '.png' />
或则
<img ::src="playFlag ? '../../../static/images/followReadPlay.png' : '../../../static/images/followReadPause.png'" />

上面的真机上显示不出来，应改为下面方式:

<img v-if="index<3" :src="require('../../static/images/no' + index + '.png')" />

:src="playFlag ? require('../../../static/images/followReadPlay.png') : require('../../../static/images/followReadPause.png')"

需注意 不要加错位置了；结果找不到图片，例如以下是错误的：

:src="playFlag ? 'require(../../../static/images/followReadPlay.png)' : 'require(../../../static/images/followReadPause.png)'"

今天在更新一种情况：
打包后css背景图路径不对的问题
问题描述：

当使用npm run dev命令本地访问的时候，背景图片是正常显示的，可使用npm run build命令打包后，访问dist目录下的项目，页面背景图路径就不对了，变成http://127.0.0.1:8080/dist/static/css/static/img/topicDetailSpaceMaps.0271ef1.png 正确地址应该是：http://127.0.0.1:8080/static/dist/img/topicDetailSpaceMaps.0271ef1.png

解决办法为：只需要在build/utils.js文件中添加如下一行代码即可。

publicPath:'../../'