vue项目引入背景图报Module not found: Error: Can't resolve './src/assets/theme/logo_blue.png' in'xxx'错误

https://blog.csdn.net/qq_34767115/article/details/95962738

vue2.5及以下版本以上两种写法都没有问题, 2.6就出现这个问题,应该和webpack配置相关 .
vue2.6用的是webapack4.0(待我学习下webpack4.0的官方文档)

也就是说在新版webpack中不管是css中还是html中内联样式应该使用3的方法来使用图片

1.相对路径: "./assets/logo_blue.png"
2.没有前缀的路径 "assets/logo_blue.png" 被webpack解析为 相对路径
3.带~的路径 "~@/assets/theme/logo_blue.png" 被webpack解析为 require(src/assets/theme/logo_blue.png) 动态引入
@在webpack 被resolve.alias配置下等价于/src
4.相对根目录的路径 "/assets/logo_blue.png" webpack不解析

 

应当需要注意的是在public和assets中的文件表现似乎不一样。

 

在js中引用图片要使用导入的方式

data(){undefined

        return {undefined

            imgUrl:require("@/assets/test.png")

        }

    }

https://blog.csdn.net/qq_31967569/article/details/115036439