vue3+vite注册全局组件

批量注册全局组件

//index.js
const modulesComponent = import.meta.globEager('../components/*.vue')
function changeStr (str) {
    return str.charAt(0).toUpperCase() + str.slice(1)
}
const install = (app) => {
    Object.keys(modulesComponent).forEach(filename => {
    // 获取组件配置
    const componentName = changeStr(
      filename.replace(/^\.\.\/components\//, '').replace(/\.\w+$/, '')
    )
    const component=modulesComponent[filename].default || modulesComponent[filename]

    app.component(componentName,component)
  })
}
export default install

//main.js
//全局组件注册
import { createApp } from 'vue'
import App from './App.vue'
const  app = createApp(App)
import moudles from './components/index'
app.use(moudles)

加载全局icon

npm install --save @ant-design/icons-vue
//index.js
import * as antIcons from '@ant-design/icons-vue'
export default (app) => {
    Object.keys(antIcons).forEach(key => {
        app.component(key, antIcons[key])
    })
}

//main.js
import { createApp } from 'vue'
import App from './App.vue'
const  app = createApp(App)
import Icons from './components/Icon/index'
app.use(Icons)

Icon图标