vue3+vite5中require引入图片失效,解决方法new URL

参考文章:https://www.jb51.net/javascript/284643cld.htm

解决方法

复制代码
官网 https://vitejs.cn/guide/assets.html#the-public-directory
html 复制代码
<div class="picfloat">
  <img :src="oneNews.floatPic" alt="1">
</div>
javascript 复制代码
import { reactive } from 'vue';

let oneNews = reactive({
  floatPic: new URL('@/assets/home-cake3.jpg',import.meta.url).href,
})
相关推荐
zhaoyang03019 分钟前
css3笔记 (1) 自用
前端·javascript·css·vue.js·笔记·html·css3
小约翰仓鼠6 小时前
vue3子组件获取并修改父组件的值
前端·javascript·vue.js
Lin Hsüeh-ch'in6 小时前
Vue 学习路线图(从零到实战)
前端·vue.js·学习
啊~哈7 小时前
vue3+elementplus表格表头加图标及文字提示
前端·javascript·vue.js
xiaogg36787 小时前
vue+elementui 网站首页顶部菜单上下布局
javascript·vue.js·elementui
HelloWord~8 小时前
SpringSecurity+vue通用权限系统
vue.js·spring boot
神探小白牙9 小时前
vue-video-player视频保活成功确无法推送问题
前端·vue.js·音视频
Angel_girl3199 小时前
vue项目使用svg图标
前端·vue.js
難釋懷9 小时前
vue 项目中常用的 2 个 Ajax 库
前端·vue.js·ajax
爱生活的苏苏10 小时前
vue生成二维码图片+文字说明
前端·vue.js