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,
})
相关推荐
会跑的葫芦怪3 小时前
若依Vue 项目多子路径配置
前端·javascript·vue.js
pas1366 小时前
40-mini-vue 实现三种联合类型
前端·javascript·vue.js
军军君017 小时前
Three.js基础功能学习十三:太阳系实例上
前端·javascript·vue.js·学习·3d·前端框架·three
Hi_kenyon9 小时前
理解vue中的ref
前端·javascript·vue.js
毎天要喝八杯水13 小时前
搭建vue前端后端环境
前端·javascript·vue.js
东东51615 小时前
果园预售系统的设计与实现spingboot+vue
前端·javascript·vue.js·spring boot·个人开发
怪兽毕设16 小时前
基于SpringBoot的选课调查系统
java·vue.js·spring boot·后端·node.js·选课调查系统
Amumu1213816 小时前
Vue Router(一)
前端·javascript·vue.js
切糕师学AI16 小时前
VSCode 下如何检查 Vue 项目中未使用的依赖?
vue.js·vscode
我是伪码农17 小时前
Vue 1.30
前端·javascript·vue.js