项目背景：项目的使用场景是面向信息安全相关部门，环境很有可能没有公网，局域网并不稳定，所以无法使用七牛等CDN保存图片资源。从而采用引入本地资源的方式 通常一张本地静态图片在vue中的写法是这样 src="@/assets/icon/demo.png ...

问题： Vue项目中，不能直接使用动态的图片资源路径。 解决方法： 方法一： 将图片放到public目录下后，直接引用 方法二： require方式引用 方法三： import方式引用 ...

class="headImg" :src="require('../../assets/uploads/'+headImg)" alt="图片资源"> ...

首先先说明下vue-cli的assets和static的两个文件的区别，因为这对你理解后面的解决办法会有所帮助 assets：在项目编译的过程中会被webpack处理解析为模块依赖，只支持相对路径的形式，如< img src=”./logo.png”>和background:url ...

问题记录：v-for循环获取img src变量动态渲染时，不显示图片 }] 解决方案：data中的数据加上require() ...

1. layer组件 - 静态加载图片缩略图 //HTML示例 <div id="layer-photos-img"> src="图片地址"> src="图片地址"> </div> < ...

assets：在项目编译的过程中会被webpack处理解析为模块依赖，只支持相对路径的形式，如< img src=”./logo.png”>和background:url(./logo.png),”./logo.png”是相对资源路径，将有webpack解析为模块依赖 用js动态加载 ...

　　项目打包，默认是打包在根目录下面的。当然我们可以通过设置，打包到任意子目录中去。 但是，当项目中引入资源的，比如：引入图片资源、js资源、或者字体图标之类的。那么可能在这个中间又会踩坑。 1、在vue文件引入图片 　　例如，我们将一张图片放到资源目录 /static/image ...