【web前端笔记】vue3 + vite的前端项目中,使用import.meta.glob()方法实现全局注册组件的通用代码

news/2024/11/17 13:49:40/

目录

1.1、如何读取所有文件

1.2、通用代码

1.3、在main.js引入


这篇文章介绍一下,在vue3和vite搭建的项目中,如何将【src/components】目录下所有的【*.vue】文件,当做一个组件全局注册到Vue对象里面。

1.1、如何读取所有文件

在vue3和vite搭建的项目里面,它给我们提供了一个import.meta.glob()】方法,使用这个方法就可以读取到指定的文件,当然了,除了可以读取具体的某个文件,它还支持使用通配符,读取目录及其子目录下的指定文件。

// 例如:读取当前文件所在目录及其子目录下的所有 *.vue 文件
// 一个星号(*)表示1或多个字符
// 两个星号(**)表示多层级目录
import.meta.glob('./**/*.vue', {eager: true});// 例如:读取指定文件,读取demo目录下的index.js文件
import.meta.glob('./demo/index.js', {eager: true});

需要注意的


http://www.ppmy.cn/news/1547727.html

相关文章

爬虫如何解决短效代理被封的问题?

在数据采集的征途上,短效代理如同一把双刃剑,它既能为我们带来速度和效率,也可能因为频繁更换IP地址而遭遇被封禁的风险。那么,作为数据采集er的我们,该如何巧妙应对,确保爬虫的稳定运行呢?今天…

MyBatis CRUD快速入门

3. CRUD操作 3.1. namespace 配置文件中namespace中的名称为对应Mapper接口或者Dao接口的完整包名 3.2. select select标签是mybatis中最常用的标签之一select语句有很多属性可以详细配置每一条SQL语句 id 命名空间中唯一的标识符接口中的方法名与映射文件中的SQL语句ID 一一…

方法论-WPS模型(高效沟通和决策分析的框架)

WPS模型(What, Problem, Solution)是一种高效沟通和决策分析的框架,旨在帮助沟通者清晰、简洁地表达问题和解决方案,特别适用于在复杂或多变的环境中进行清晰的交流。WPS模型的核心是通过以下三个步骤来组织沟通内容: …

SpringBootTest常见错误解决

1.启动类所在包错误 问题 由于启动类所在包与需要自动注入的类的包不在一个包下: 启动类所在包: com.exmaple.test_02 但是对于需要注入的类却不在com.exmaple.test_02下或者其子包下,就会导致启动类无法扫描到该类,从而无法对…

继承和多态(上)

目录 一.继承 1.何为继承 2.继承的语法 3.子类访问父类 (1)子类访问父类的成员变量 (2)子类访问的父类方法 二.super关键字 1.super用于调用父类的构造方法 2.super用于调用父类的实例方法 3.super用于访问父类的实例变量 三.子父类构造方法 和代码块的执行优先顺序…

SQLite 和 MySQL语法区别

SQLite 和 MySQL 在 SQL 语法上有一些差异,这些差异主要体现在数据类型、函数、表和索引的管理等方面。以下是一些主要的不同之处: 1. 数据类型 SQLite 支持的数据类型包括:TEXT, INTEGER, REAL, BLOB。动态类型系统,允许在插入…

跨域问题的产生和解决

1. 为什么会产生跨域 前后端分离模式下,客户端请求前端服务器获取视图资源,然后客户端自行向后端服务器获取数据资源,前端服务器的协议、IP和端口和后端服务器很可能是不一样的、这样就产生了跨域。 这主要是因为浏览器的同源策略导致的&…

HTTP 协议及内外网划分详解

内容预览 ≧∀≦ゞ 黑客网络基础之超文本协议与内外网划分声明导语1. HTTP 协议简介HTTP 协议的演变1.1 HTTP/0.91.2 HTTP/1.01.3 HTTP/1.11.4 HTTP/21.5 HTTP/3 2. HTTP 协议的主要请求方法2.1 GET2.2 POST2.3 PUT2.4 DELETE2.5 HEAD2.6 OPTIONS2.7 TRACE 3. HTTP 协议中的 UR…