Vite通用组件自动化注册

需要用到两个关键的知识点

1，vite的Glob导入功能：可帮助我们在文件系统中导入多个模块

2，vue的defineAsyncComponent方法：可以创建一个按需加载的异步组件

基于以上两点实现组件自动注册

import { defineAsyncComponent } from 'vue'
// 实现自动注册组件
export default {
  install(app) {
    // 获取当前路径任意文件夹下的 index.vue 文件
    const components = import.meta.glob('./*/index.vue')
    // 遍历获取到的组件模块
    for (const [key, value] of Object.entries(components)) {
      // 拼接组件注册的 name
      const componentName = 'm-' + key.replace('./', '').split('/')[0]
      // 通过 defineAsyncComponent 异步导入指定路径下的组件
      app.component(componentName, defineAsyncComponent(value))
    }
  }
}