记录一下vue在img src中贴的图片路径显示can‘t resolve

歪� 2022-06-18 16:33:55

vue版本3.0以上，

最开始在<img src=""> src里面贴的绝对路径，然后显示can‘t resolve，修改为

data(){
    return{
       logo:require('~@/views/img/moyu.png')
    }
}

不知道require为什么也失败了

最后是在img里面贴了相对路径

<img src="../views/img/moyu.png" alt="logo">

，可以直接用ctrl+右键点出来。

...全文

434 1 打赏收藏转发到动态举报

写回复

1 条回复

切换为时间正序

请发表友善的回复…

发表回复

CSDN-Ada助手 2023-01-13

打赏
举报

回复

您可以前往 CSDN问答-前端发布问题, 以便更快地解决您的疑问

自定义样式时需要设置背景图片background-image, 直接引用相对路径（../assets/img/图片）， vue报错 can’t resolve ‘../assets/img/图片’, 修改路径为~@/assets/img/图片 .menuActive{ background:url("~@/assets/nav/nav_menu_pick.png") no-repea...

这个错误表明在Top.vue组件中引用的图片路径./src/assets/home_top_bg.png无法找到。确认图片文件是否存在：检查src/assets目录下是否存在名为home_top_bg.png的图片文件。确认图片路径是否正确：检查Top.vue组件中图片引用的路径是否正确。确保路径与图片实际位置相符。确认图片名称是否正确：如果图片文件名为home_top_bg.png，确保在代码中引用图片时大小写和拼写是一致的。重新运行项目：如果你对以上问题进行了修复，请重新运行项目并确保错误是否消失。

之前使用都是没有问题啊,为什么有问题呢?去查资料很快找到了解决办法 background: url('./src/assets/theme/logo_blue.png') no-repeat center center; 改为 background: url('~@/assets/theme/logo_blue.png') no-repeat center center; 那...

vue2.5及以下版本以上两种写法都没有问题, 2.6就出现这个问题,应该和webpack配置相关 .第二个问题: webpack资源处理的规则,分为相对路径,没有前缀的路径,带~的路径,相对根目录的路径。vue2.6用的是webapack4.0(待我学习下webpack4.0的官方文档)2.为什么要这么写?~和@是什么意思呢?1.之前这样写为什么没有错?第一个问题:查资料发现,

怎样将包的路径一起打包inde.html文件夹中显示如下效果<!DOCTYPE html><html lang="en"><head><meta charset="utf-8" /><meta http-equiv="X-UA-Compatible" content="IE=edge" /><title></title&...

51,412

社区成员

86,031

社区内容

发帖

与我相关

我的任务

javaspring bootspring cloud 技术论坛（原bbs）

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章