vue3+vite如何获取资源文件夹

步骤很详细,直接上代码

可以使用glob获取文件夹内容

*指的是通配符,切记别漏了

 const files = import.meta.glob('/public/backgroundImages/*')Object.keys(files).forEach(item => {console.log(item)})const files1 = import.meta.glob('/src/assets/*')Object.keys(files1).forEach(item => {console.log(item)})

如果直接使用这样获取的路径的话打包以后会出问题

我们可以根据打包的文件位置通过替换为绝对路径的方法进行修改,

例如:public文件夹打包以后子文件夹会直接放在一级目录/public/可替换为./

同理:/src/可替换为./

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

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

相关文章

入门Java编程的知识点—>面向对象(day07)

重点掌握什么是面向对象?重点掌握面向对象封装的意义?重点掌握类的封装,创建对象,访问对象? 面向对象 OO:(Object Oriented)面向对象 面向对象是一种编程思想,遵循面向对象设计原则可以写出高质量代码, …

数学建模学习(122):基于PPF-AHP的多准则决策分析—以城市交通枢纽选址为例

这是一个2024年3月最新出的AHP算法,可以适用于更加复杂的情况。 文章目录 1. 引言2. 理论基础2.1. 层次分析法 (AHP)2.2. Proportional Picture Fuzzy 集合 (PPF)2.3. PPF-AHP 结合3. 案例背景:城市公共交通枢纽选址3.1 决策准则的成对比较矩阵构建3.2 Python代码实现参考文献…

sheng的学习笔记-AI-生成式方法

AI目录:sheng的学习笔记-AI目录-CSDN博客 需要额外的知识对应连接: EM:sheng的学习笔记-AI-EM算法-CSDN博客 贝叶斯: sheng的学习笔记-AI-贝叶斯(Bayesian)分类-CSDN博客 高斯混合模型:shen…

python实现循环神经网络

为了提供一个基础的循环神经网络(RNN)示例,我们可以使用TensorFlow和Keras,这是构建和训练神经网络常用的两个库。以下是一个简单的RNN实现,用于处理序列数据(如时间序列数据或文本数据)。在这个…

C#中的WebClient与XPath:实现精准高效的Screen Scraping

在现代互联网中,Screen Scraping(屏幕抓取)已成为从网页中提取信息的重要技术。对于C#开发者来说,WebClient和XPath是实现高效抓取的重要工具。本文将概述如何使用C#中的WebClient类结合XPath技术,实现精准高效的Scree…

Day15_设计模式

文章目录 设计模式说一下你的这两个项目用了什么设计模式?为什么要这么用?说说什么是单例模式1.饿汉式:在类初始化时直接创建实例对象,不管你是否需要这个对象,都会创建。 **没有线程安全问题**2.懒汉式:延迟创建这个实例对象 (什么时候调用get方法 什么时候创建对象)3…

【Java EE】深入探讨 Java 中 Thread 类的使用

在现代软件开发中,随着硬件性能的提升,多线程编程已成为提升应用程序性能的关键手段之一。Java 提供了多种处理并发任务的工具,其中 Thread 类是基础。本文将详细探讨 Thread 类的使用,包括线程的创建与启动、线程的中断、线程的等…

流媒体服务器如何让WebRTC支持H.265,同时又能支持Web js硬解码、软解码(MSE硬解、WASM软解)

为了这一整套的解决方案,调研研发整整花费了差不多半年多的时间,需达成的目标: 流媒体服务器端不需要将H.265转码成H.264,就能让Chrome解码播放H.265; 注意:现在很多市面上的软硬件通过转码H.265成H.264的…

Python中的命令模式:如何设计灵活的命令体系

Python中的命令模式:如何设计灵活的命令体系 命令模式是一种行为设计模式,它将请求封装为对象,从而使用户能够以不同的方式参数化客户端的请求、排队请求、记录请求日志,或者支持可撤销的操作。在Python中,命令模式的…

融合创新趋势:Web3时代的跨界融合

随着互联网技术的飞速发展,Web3时代的到来正引领着一场深刻的技术与社会变革。Web3,作为下一代互联网技术的代表,不仅仅是一种技术创新,更是一种跨界融合的趋势。通过去中心化、智能合约和区块链技术的应用,Web3正在重…

django学习入门系列番外篇《request》

文章目录 1 Response功能介绍2 HttpResponse2.1 HttpResponse对象介绍content_typeContent-Type是什么?Content-Type的格式 Content-DispositionContent-Disposition的作用Content-Disposition的使用语句 例子 2.2 HttpResponse常用用法 3 JsonResponse3.1 JsonResp…

编写一个程序,输入a、b、c三个值,输出其中最大值。

/* 题目描述 编写一个程序&#xff0c;输入a、b、c三个值&#xff0c;输出其中最大值。 输入 在一行中输入三个整数 输出 三个数中最大的数 */ #include<stdio.h> #include<math.h> int main(void) { int a, b, c; scanf("%d %d %d", &…

vue组件双向绑定

在Vue中&#xff0c;双向绑定是一个核心概念&#xff0c;它允许数据在视图&#xff08;View&#xff09;和组件的状态&#xff08;或数据模型&#xff09;之间自动同步。这种机制主要通过Vue的v-model指令来实现&#xff0c;但v-model实际上是一个语法糖&#xff0c;它背后依赖…

软件架构设计——关联对象

关联对象的原理 关联对象是在软件架构设计中&#xff0c;用来表示两个或多个对象之间的关系。它们通过引用或指针相互关联&#xff0c;从而可以彼此访问对方的数据和行为。这种关联可以是单向的&#xff0c;也可以是双向的&#xff0c;具体取决于业务需求。 单向关联&#xf…

malloc的底层原理和流程

目录 一、malloc的内存申请方式二、malloc的内存池管理1、分级内存池2、内存块信息3、内存块合并4、内存块分割 三、brk的内存分配过程1、空闲链表2、sbrk 四、malloc的缺陷 前言&#xff1a;从malloc的内存方式、内存池管理、brk系统调用过程这三个点&#xff0c;讲述malloc系…

2054. 骑马修栅栏

代码 #include<bits/stdc.h> using namespace std; int mp[505][505]; queue<int> ans; int du[505]; int n0,m,u,v;void dfs(int i) {for(int j1;j<n;j){if(mp[i][j]>1){mp[i][j]--;mp[j][i]--;dfs(j);}}ans.push(i); } int main() {cin>>m;for(int …

Linux安装Miniconda3

Linux安装Miniconda3 安装步骤相关知识 安装步骤 官方安装指南。 mkdir -p ~/miniconda3 wget https://repo.anaconda.com/miniconda/Miniconda3-latest-Linux-x86_64.sh -O ~/miniconda3/miniconda.sh bash ~/miniconda3/miniconda.sh -b -u -p ~/miniconda3 rm ~/miniconda…

WordPress简约响应式个人博客Kratos主题

Kratos主题基于Bootstrap和Font Awesome的WordPress一个干净&#xff0c;简单且响应迅速的博客主题&#xff0c;Vtrois创建和维护&#xff0c;主题设计简约友好&#xff0c;并且支持响应式&#xff0c;自适应访问&#xff0c;简seo单大方的主页构造&#xff0c;使得博客能在臃肿…

(十六)Flink 状态管理

目录 状态类型 Keyed State Keyed State 分类 状态有效期(TTL) 过期数据的清理 Operator State Broadcast State 状态存储 State Backends 分类 设置 State Backend RocksDB State Backend 详解 在 Flink 架构体系中,状态(State)计算是其重要的特性之一。状态用…

8.20T3 无损加密(线性代数转LGV+状压dp+高维前缀和)

http://cplusoj.com/d/senior/p/NODSX2301C 对于式子&#xff1a; 这个神秘的线性代数形式比较难处理&#xff0c;但我们可以考虑其组合意义。行列式现存的可用组合意义之一就是LGV&#xff08;矩阵式不太可用&#xff09; 先把原先的矩阵转化为一个有向图。现在我们要构造一…