// 手动注册组件
// import svgIcon from './svg-icon/index.vue'
// import popup from './popup/index.vue'
// export default {
// install (app) {
// app.component('m-svg-icon', svgIcon)
// app.component('m-popup', popup)
// }
// }
// vite 自动注册组件
import { defineAsyncComponent } from "vue";
export default {
install(app) {
// 1. 获取当前路径下所有文件夹中的 index.vue
const components = import.meta.glob('./*/index.vue')
// 2. 遍历获取到的组件模块
for (const [fullPath, fn] of Object.entries(components)) {
// 3. 利用 app.component 注册组件
const componentName = 'm-' + fullPath.replace('./', '').split('/')[0]
app.component(componentName, defineAsyncComponent(fn))
}
}
}
目录层级结构
main.js中引入