v-for循环图片加载不出来，直接在src上面写图片链接就可以加载出来，或者使用require(图片链接)可以加载出来

vue中动态图片加载不出来

原因

在webpack中会将图片图片来当做模块来用，因为是动态加载的，所以url-loader将无法解析图片地址，然后npm run dev 或者npm run build之后导致路径没有被加工
图片在浏览器中的路径显示是经过base64加密的。.
先说明下vue-cli的assets和static的两个文件的区别，因为这对你理解后面的解决办法会有所帮助

1. assets：
   在项目编译的过程中会被webpack处理解析为模块依赖，只支持相对路径的形式，如< img src=”./logo.png”>和background:url(./logo.png),”./logo.png”是相对资源路径，将有webpack解析为模块依赖
2. static：在这个目录下文件不会被webpack处理,简单就是说存放第三方文件的地方，不会被webpack解析。他会直接被复制到最终的打包目录(默认是dist/static)下。必须使用绝对路径引用这些文件，这是通过config.js文件中的build.assetsPublic和build.assertsSubDirectory链接来确定的。任何放在static/中文件需要以绝对路径的形式引用：/static[filename]

根据webpack的特性，总的来说就是static放不会变动的，第三档的文件，asserts放可能会变动的文件

<img :src="require(`../../assets/img/${element.imgNm}.png`)" class="chart-img-small">

如下图片是通过require引出的路径图片, 引入的图片名称为bar.png, 加密后变成底下图片名称

没有使用require的,会报404,