在vite中怎么批量注册组件
1. 在webpack中使用require来获取组件
/ 参数:1. 目录 2. 是否加载子目录 3. 加载的正则匹配
//匹配当前文件夹下的所有.vue文件 注册全局组件
const importFn = require.context('./', false, /\.vue$/)
// console.dir(importFn.keys()) 文件名称数组
export default {
install (app) {
// 批量注册全局组件
importFn.keys().forEach(key => {
// 导入组件
const component = importFn(key).default
// 注册组件
app.component(component.name, component)
})
}
} // 在main.js中使用
import allComponent from '@/components/library/index.js'
createApp(App)
.use(store)
.use(router)
.use(allComponent)
.mount('#app')
2. 在vite中使用 import.meta.glob
const app = createApp(App); // 批量注册全局组件
const components = import.meta.glob('./components/uiSchema/itemComponents/*.vue')
for (const [key, value] of Object.entries(components)) {
const name = key.slice(key.lastIndexOf('/') + 1, key.lastIndexOf('.'))
console.log('当前组件时',name);
app.component(name, defineAsyncComponent(value))
}
在vite中怎么批量注册组件的更多相关文章
- ASP.NET CORE 学习之原生DI实现批量注册
以前使用Autofac的时候,只需一句AsImplementInterfaces()就可以很轻松实现批量注册功能.而asp.net core内置的DI框架没有现成的批量注册方法,考虑到替换Autofa ...
- Vue 批量注册局部组件及应用
博客地址:https://ainyi.com/105 批量注册路由的有个博客说到:https://ainyi.com/77 实际工作中,可能会遇到一个大页面里面有很多个模块,这些模块一般是需要拆分到单 ...
- RegisterDllAndOcx.bat -批量注册当前文件夹中的dll和ocx
批量注册当前文件夹中的dll和ocx 新建文件:RegisterDllAndOcx.bat @echo off echo hello,girl~~ for %%i in (*.dll *.ocx) ...
- 向Spring容器中注册组件的方法汇总小结
1.通过xml定义 <bean class=""> <property name="" value=""></ ...
- [翻译]Component Registration in Script System 在脚本系统中注册组件
Component Registration in Script System 在脚本系统中注册组件 To refer to our component from a script, the cl ...
- 在ASP.NET Core中使用托管启动(hosting startup)程序集,实现批量注册service
在启动ASPNET Core时可以从外部程序集向应用添加增强功能.例如,外部库可以用托管启动( hosting startup) 实现为应用程序提供附加配置(Configuration)或服务(ser ...
- 8、组件注册-@Import-给容器中快速导入一个组件
8.组件注册-@Import-给容器中快速导入一个组件 8.1 给容器中注册组建的方式 包扫描+组建标注注解(@Controller.@Service.@Repository.@Component)[ ...
- 2、组件注册-@Configuration&@Bean给容器中注册组件
2.组件注册-@Configuration&@Bean给容器中注册组件 2.1 创建maven项目 spring-annotation pom.xml文件添加 spring-context 依 ...
- spring注解开发:容器中注册组件方式
1.包扫描+组件标注注解 使用到的注解如下,主要针对自己写的类 @Controller @Service @Repository @Component @ComponentScan 参考 spring ...
- Spring注解驱动开发04(给容器中注册组件的方式)
给容器中注册组件的方式 1. 组件注解标注 + 包扫描(适用于自己写的类) //控制层组件 @Controller public class PersonController { } //业务逻辑层组 ...
随机推荐
- 1487. 保证文件名唯一 (Medium)
问题描述 1487. 保证文件名唯一 (Medium) 给你一个长度为 n 的字符串数组 names .你将会在文件系统中创建 n 个文件夹:在第 i 分钟,新建名为 names[i] 的文件夹. 由 ...
- 关于vscode 一些配置
一. 基本操作 1.创建完项目, code . 直接在vscode 中打开 2.设置--首选项 检测 package.json 文件 点击serve 是可以运行 3.常用的vscode 插件 ...
- ionic4 可能忽略的一些细节
1.iOS中,页面被状态栏遮挡的问题 有的说 具体是解决是 在config.xml 配置如下代码 <preference name="StatusBarStyle" ...
- Java--Comparable接口实现,控制数组和列表的排序
实现Comparable 接口,可以获得的排序方法有 列表排序 Collections.sort(); 数组排序 Arrays.sort(); sort()方法中的参数是可以获取排序索引的对象或者按照 ...
- vue.use的原理
接收一个vue组件 该组件应该有个方法,install customComponent.install=function(Vue){ vue.Component('name',custemCompon ...
- Qt使用图片旋转绘制圆环,圆弧类UI界面(方法可适用于winform和WPF等其余UI绘制)
先上效果图: 这个主要是一个试剂杯盘的循环图,相信大家伙一定都想到了使用GDI和三角函数来进行计算,但如果没有实际尝试,可能会踩一些坑,留此文帮助大家方便快捷的绘制出类似圆环的UI效果. 这里主要是使 ...
- 数据库链接失败错误ERROR com.alibaba.druid.pool.DruidDataSource - {dataSource-1} init error解决
用java -jar启动之后,只要一访问数据库就报错,错误信息如下: 文字如下: 2019-07-02 10:25:12.220 ---> [http-nio-8080-exec-1] ---& ...
- org.aspectj.lang不存在,引入失败。
问题:添加了依赖,或引入了jar包但是写aspect类时无法引入 解决办法:
- 第二周集训队比赛wp
Web1 直接截包改get为Host: Web2: 不一样的猪圈 普通的猪圈变种 NormalPwn 用IDA查看发现main下面有一个危险函数点进去发现/bin/sh 进main空格发现找cmman ...
- 2023-03-01 'react-native' 不是内部或外部命令,也不是可运行的程序 这个报错是因为你没有全局安装react-native的脚手架,请执行下面代码全局安装react-native脚手架👇
问题描述:想要初始化一个新的rn项目,执行[react-native init myApp --version 0.68.2],报错:'react-natvie' 不是内部或外部命令,也不是可运行的程 ...