Vite 踩坑 —— require is not defined

动态require引入图片报错    

require 是属于 Webpack 的方法,而我使用的是 Vite,所以我们需要去寻找 Vite 静态资源处理的方法

所以,我们只需要将代码改写以下形式即可。 ​

template

<CarouselItem v-for="(item,index) of carouselData" :key="index"><img :src="getImageUrl(item.img_name)" />
</CarouselItem>

script

setup() {const getImageUrl = (name) => {return new URL(`../../lib/Carousel/assets/${name}`, import.meta.url).href}return {carouselData,getImageUrl}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/140513.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

基于安卓Android的人在旅途旅行出行APP

项目介绍 首先,论文一开始便是清楚的论述了系统的研究内容。其次,剖析系统需求分析,弄明白“做什么”,分析包括业务分析和业务流程的分析以及用例分析,更进一步明确系统的需求。然后在明白了系统的需求基础上需要进一步地设计系统,主要包罗软件架构模式、整体功能模块、数据库…

Mini小主机All-in-one搭建教程6-安装苹果MacOS系统

笔者使用的ESXI7.0 Update 3 抱着试试的态度想安装一下苹果的MacOS系统 主要步骤有2个 1.解锁unlocker虚拟机系统 2.安装苹果MacOS系统 需要下载的文件 unlocker 这一步是最耗时间的&#xff0c;要找到匹配自己系统的unlocker文件。 https://github.com/THDCOM/ESXiUnloc…

解决appium或selenium使用时driver.find_element_by_xpath中间有删除线问题

一、问题描述 Darren洋在公司电脑搭建完成appium后准备运行appium2.0版本执行脚本时发现执行脚本中的driver.find_element_by_xpath中间有删除线&#xff0c;说明较高版本的appium及selenium中该方法已被弃用。 二、解决办法 该问题解决办法为将driver.find_element_by_xpath()…

音视频技术开发周刊 | 315

每周一期&#xff0c;纵览音视频技术领域的干货。 新闻投稿&#xff1a;contributelivevideostack.com。 OpenAI科学家最新演讲&#xff1a;GPT-4即将超越拐点&#xff0c;1000倍性能必定涌现&#xff01; GPT-4参数规模扩大1000倍&#xff0c;如何实现&#xff1f;OpenAI科学家…

uniapp collapse动态生成多个折叠面板手动展开收起(包括uni-ui版)

前言 官方文档没有暴露出相关api&#xff0c;那就看看组件源码。 以下示例均通过 vue-cli 创建的 uni-app h5 项目 uView&#xff08;1.x&#xff09;版本 源码 node_modules\uview-ui\components\u-collapse-item\u-collapse-item.vue 这个方法是用来改变折叠面板子组件收起还…

万界星空科技云MES系统产品追溯功能介绍

制造业工厂产品质量贯穿于产品的整个生命周期&#xff0c;也是企业参与市场竞争求生存求发展的基础&#xff0c;而制造过程中出现的产品质量问题则是产品最终质量的基石。 MES系统是一种信息化管理系统&#xff0c;它可以实现产品的全生命周期的监控和管理&#xff0c;同时&am…

15.2 主机探测与路由追踪

Ping 使用 Internet 控制消息协议&#xff08;ICMP&#xff09;来测试主机之间的连接。当用户发送一个 ping 请求时&#xff0c;则对应的发送一个 ICMP Echo 请求消息到目标主机&#xff0c;并等待目标主机回复一个 ICMP Echo 回应消息。如果目标主机接收到请求并且网络连接正常…

基于Java的考研信息查询系统设计与实现(源码+lw+部署文档+讲解等)

文章目录 前言具体实现截图论文参考详细视频演示为什么选择我自己的网站自己的小程序&#xff08;小蔡coding&#xff09; 代码参考数据库参考源码获取 前言 &#x1f497;博主介绍&#xff1a;✌全网粉丝10W,CSDN特邀作者、博客专家、CSDN新星计划导师、全栈领域优质创作者&am…

Jetpack:012-Jetpack中的弹出菜单

文章目录 1. 概念介绍2. 使用方法2.1 DropdownMenu2.2 DropdownMenuItem 3. 示例代码3.1 代码和注释3.2 代码难点3.3 运行效果 4. 内容总结 我们在上一章回中介绍了Jetpack中标题栏相关的内容&#xff0c;本章回中主要 弹出菜单。闲话休提&#xff0c;让我们一起Talk Android …

权威赛事、高额奖金,文心一言插件开发邀你来挑战!

2023 CCF大数据与计算智能大赛&#xff08;CCF BDCI&#xff09;盛大开幕&#xff0c;百度文心赛题“文心一言插件设计与开发”正式上线。权威赛事&#xff0c;高额奖金&#xff0c;等你来挑战。 10月15日&#xff0c;由中国计算机学会主办的第十一届CCF大数据与计算智能大赛启…

10.17七段数码管单个多个(部分)

单个数码管的实现 第一种方式 一端并接称为位码&#xff1b;一端分别接收电平信号以控制灯的亮灭&#xff0c;称为段码 8421BCD码转七段数码管段码是将BCD码表示的十进制数转换成七段LED数码管的7个驱动段码&#xff0c; 段码就是LED灯的信号 a为1表示没用到a&#xff0c;a为…

【ArcGIS绘图系列1】在ArcGIS中制作柱状图与饼状图

成图展示 图形出处&#xff1a;J2023-Assessment of agricultural drought based on multi-source remote sensing data in a major grain producing area of Northwest China 实现步骤 第一步 查看数据信息 数据输入到ArcGIS中&#xff1a;包含数据表和shp文件 1、shp文件…