vue3报错5 vue中用require处理图片地址 can‘t find module ‘...png/jpg‘

最新推荐文章于 2024-05-24 14:07:14 发布
最新推荐文章于 2024-05-24 14:07:14 发布
阅读量1.4k 收藏 3
点赞数 2
分类专栏： # vue3报错合集 文章标签： 前端 vue require 绑定图片地址 vue3
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yangyangdt/article/details/122464737
版权

img不会识别这种动态绑定：会报错。

<img :src="'../../public/img'+item.url" /><br>

src绑定的会解析成一个纯字符串，只能通过在js里require（）先包一下，拼接好再显示。

require的使用方法：

require的作用就是解析动态绑定的图片路径。
下面这种写死的则不用动态绑定。

最低0.47元/天 解锁文章
luanmabug
关注
  • 2
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
技巧3 vue3项目 axios前后端交互 图片地址拼接方法
yangyangdt的博客
01-12 3598
当图片存储在前端的public文件夹下，后端的图片地址很可能是图片的名字，而不是路径，因为路径是前端的图片存储相对路径。这个时候就需要前端接到后端传值去拼接路径了。
Vue3 动态添加图片路径
一只小鹰
06-24 4024
原文地址： https://www.jeremyjone.com/844/， 转载请注明 开始之前 之前在 vue2 中经常使用类似方法，直接 reuqire(<url>) 即可。今天在写 vue3 的内容时，遇到了，习惯性的填上了这个，结果发现不行~ 都怪我，确实还没完整的看上一遍 vite 的内容，就是一直使用而已。这下好了，赶紧一番搜索翻阅文档，vite 和 webpack 的核心差别还是挺大的，在 vite 中并没有这样的包。于是就有了下面的操作。 解决方法 对于所有动态拼接的路径，只
vue-cli动态加载图片问题，报错Cannot find module
lyy18719172450的博客
04-18 620
在做项目时遇到动态设置图片出现错误 <script> export default{ data(){ return{ src:'', img:'E:/web/vue-shop/src/assets/b7a99470-9f7b-11eb-aad4-45fe018fae54.jpg' } }, created(){ this.get() }, methods:{
Error: Cannot find module ‘./XXX.jpg‘ 问题解决 Vue动态显示图片
weixin_43643765的博客
10-29 4755
刚开始学习Vue 在循环输出图片时，浏览器报错Error: Cannot find module ‘./tqwl.jpg’ 这张图片是放在本地文件夹内的 这是图片的展示代码 <el-table-column label="展示" width="180"> <template slot-scope="scope"> <el-image style="width: 100px; height: 100px"
前端开发攻略---三种方法解决Vue3图片动态引入问题
最新发布
nibabaoo的博客
05-24 2792
解决Vue3图片动态引入问题
Vue在v-for循环中动态加载相对路径图片，Error: Cannot find module ‘xxx‘的问题
如需咨询可联系我，V：chen2318341674
01-29 1970
Vue在v-for循环中动态加载相对路径图片，Error: Cannot find module 'xxx’的问题； 通过v-for来循环图片（图片是在当前项目内-相对路径） 先贴出正确的代码 <template> <div style="font-size: 0.15rem;"> <div class="tab"> <img :src="item.url" v-for="item in imgs" /> </div&gt
vue3 动态获取图片地址
sj18838107211的博客
04-09 480
vue3 动态获取图片地址
Vue项目启动报错：error:cannot find module xxx
m0_74152912的博客
05-10 1972
原因：无法找到项目依赖的某个模块。如果报错，使用强制清除重新安装依赖
vue 引入图片出现错误 Cannot find module ‘./XXX.jpg‘e
Python-PTA操作
11-05 1704
vue 引入图片出现错误 Cannot find module ‘./XXX.jpg‘e
vue总是报Error Cannot find module 解决办法.网上的都试了不管用,用这招成功
11-10
在Vue.js开发过程中，我们可能会遇到“Error: Cannot find module”这样的错误，这通常是由于模块导入路径不正确、npm包未安装或者环境配置问题导致的。以下是一些常见的解决步骤和详细解释，希望能帮助到遇到此类...
vite5+vue3+ import.meta.glob动态导入vue组件
03-25
Vue3 是 Vue.js 框架的最新版本，引入了 Composition API 等重大改进，让代码更加模块化和易于管理。而 `import.meta.glob` 是 Vite 提供的一个强大特性，用于动态导入资源，尤其是适用于处理 Vue 组件的动态导入。 ...
Vue 报错TypeError: this.$set is not a function 的解决方法
10-17
在Vue.js框架中，`this.$set`是一个用于添加响应式属性的方法，它遵循Vue的依赖追踪机制，确保新添加的属性能够触发视图更新。然而，当你遇到`TypeError: this.$set is not a function`的错误时，通常是因为`this`上...
Three.js3D场景编辑器（vue3版本）
10-18
vue3，three.js，vite。 构建的three.js3D场景编辑器。支持场景导入，导出。自定义配置。 导出的文件支持https://www.npmjs.com/package/scene-view。解析器解析渲染。 目前为纯前端单机版。 当前文件为打包后文件，...
Vue中通过<script></script>引入的Vue.js文件
04-28
我们可以在 Vue.js 的官网上直接下载 vue.min.js 并用 <script> 标签引入。 格式就是： <script src="./js/vue%20(1).js" type="text/javascript" charset="UTF-8"></script> src里面的内容根据自己的下载的Vue.js的...
vue项目中，使用require动态加载本地图片报错找不到模块
teddyWithPig的博客
12-10 8108
vue项目中，使用require动态加载本地图片 记录一下工作中遇到的问题：vue中使用require(path)加载动态路径报错 <ul class="menu-list"> <li v-for="(item, index) of menuList" :key="index" :class="['menu-item', activeIndex === index ? 'menu-item-active' : '']"
功能问题：如何在Vue3中引用本地图片路径？
m0_74802419的博客
03-20 1465
在使用el-image组件加载本地图片时，总是提示Failed，图片显示不出来。使用require当然也无济于事，因为我的项目脚手架用的是Vite。
vue 项目 下载图片地址 和图片名称
酱子
09-16 792
vue 项目 下载图片地址 和图片名称 引入：import { downloadImage } from '@/utils/downloadImg' 使用：downloadImage(imgurl, imgname) export const downloadImage = (imgsrc, name) => { // 下载图片地址和图片名 var image = new Image() image.setAttribute('crossOrigin', 'anonymous') ima
React(jsx)中 require(''xx.png) 报错 Cannot find module './xx.png' 或 img src '[object Module]'
m0_37148591的博客
03-31 3253
前言 日常积累，欢迎指正 正文 error react(jsx)中 require(''xx.png) 报错 Cannot find module './xx.png' 解决办法 url-loader 配置添加 option.esModule = false 即可，我的完整配置 module.exports = { module: { rules: [ { ...
vue3+ts 引用本地图片路径的解决方案
热门推荐
u014678583的博客
08-20 1万+
因为vue3相对vue2来说已经取消了“require”这块，在vue2中不管是页面还是js板块中引用图片途径的话都可以require('@images/xxx.png')，但是经过测试发现vue3如果这种引用的话是会报错的，提示找不到require vue2中的vue.config.js配置@images别名 下面是正式在vue3引用的方法 首先说下我这个图片放置路径，我是放在assets/images/文件夹中 1、在页面内引用 <img src="../asset..
Cannot find module  ../../components/test.vue  or its corresponding type declarations
07-27
- *2* *3* [Cannot find module ‘@/views/test/index.vue‘ or its corresponding type declarations.ts(2307)的原因](https://blog.csdn.net/m0_57996540/article/details/130726601)[target="_blank" data-report...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值