vite实现组件批量注册

components/index.ts

// 统一的注册所有的全局组件import { App } from'vue'exportdefault {
  install(Vue: App) {
    const components = import.meta.globEager('./*/*.vue') 
    Object.keys(components).forEach((key: any) => {
      const com: any = components[key] // 组件模块let component = com.default  //组件对象
      Vue.component(component.name, component)
    })
  }
}

main.ts 引入

import pluginCom from'@/components'
createApp(App).use(pluginCom).mount('#app')

说明:

需要给组件添加name属性,即最后的组件名    
 保持跟以下格式一致即可
<scriptsetupname="bread">// 这里随便写一个注释即可  不然什么都不写注册会找不到name</script>

猜你喜欢

转载自blog.csdn.net/qq_38806666/article/details/129058274