在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 { } //业务逻辑层组 ...
随机推荐
- element+Vue el-form组件进行查询时,当输入框仅有一项时,回车自动提交表单,浏览器会刷新页面
vue的写法就是el-form上添加阻止默认事件 @submit.native.prevent <el-form ref="queryForm" label-width=&q ...
- cmake:macro,function中ARGV,ARGN参数的区别
cmake中的宏(macro)和函数(function)都支持动态参数 变量ARGC记录传入的参数个数 变量ARGV0,ARGV1,...顺序代表传入的参数 变量ARGV则是一个包含所有传入参数的li ...
- QML笔记
文章钢要: 1.qml基础知识 2.qml语言技巧 一.QML basic types QML Language提供的基础类型:int ,bool,string,double,real,var,url ...
- 2022-05-19内部群每日三题-清辉PMP
1.项目经理与项目相关方开会,获得关于如何最好地向施工现场输送用品的信息和知识.这使用的是哪种沟通方法类型? A.交互式沟通 B.内部沟通 C.拉式沟通 D.推式沟通 2.一个国际团队被分配到一个项目 ...
- 宝塔Linux定时shell
定时清除缓存文件 rm -rfv /www/wwwroot/www.xxx.com/runtime 定时解压,常用于定时恢复站点 解压到当前 cd /www/wwwroot/www.xxx.com t ...
- Datax-web的入门使用
在学习入门之前,需要先启动Datax-web(Datax-web入门配置与启动) 1.登录 账户:admin 密码:123456 2.创建项目 3.新建执行器 项目中有默认的,可以直接使用 4.新建数 ...
- 初识swoole
环境: 腾讯云服务器 centos7 在安装完swoole服务之后 使用 php -m 查看是否有该组件 确认存在后 在根目录下 创建一个文件夹 当做专门测试swoole使用 如 8 在该文件夹下 ...
- C# 调用Web Api通用方法
1.通用方法 public class GetDataByWebApi { /// <summary> /// 通过web api获取数据的方法 /// </summary> ...
- mysql8改密码
登录后执行语句 ALTER USER 'test'@'localhost' IDENTIFIED WITH MYSQL_NATIVE_PASSWORD BY '新密码'; 修改Host范围 updat ...
- vue 数组对象深拷贝 并根据某项属性排序
vue 数组对象深拷贝 并根据某项属性 serialNumber 排序 原始数据 navListData: [ { name: '企业速览', isHot: false, isVip: fals ...