这里的层级（publicPath: ‘…/…/’ ）具体看你打包后的目录结构，我这里的层级如下图，各自根据自己的情况确定
这个时候打包出来的路径，根据你的assetsPublicPath配置而定了，这里就不举例了，执行查看是否打包正常。
第四种方法
前面三种方案都是说的老项目，已经大量的图片引入，没有办法了。但是若果图片资源不多，或者是新项目，这个时候的话不需要这么麻烦去改打包配置。我们可以从一开始就避免这个问题。对于html中的img标签我们可以通过import的方式先把图片引入，然后放到data中，在绑定到src上。
import logo from "../assets/logo.png";
data() {
return {
logo，
};
},
<img :src="logo" width="78" height="78" alt="logo">css中的路径我们可以通过@来引入（@等价于src目录）比如：
background: url("@/assets/logo.png") no-repeat;又或者，直接不要放到asstes目录下，也可以避免这个问题发生。
总结
到此这篇关于vue css 引入asstes中的图片无法显示的四种解决方法的文章就介绍到这了,更多相关vue css 引入asstes 图片内容请搜索软件开发网以前的文章或继续浏览下面的相关文章希望大家以后多多支持软件开发网！
