vue中将组件注册为全局组件（不用手动导入）

在全局需要的componets文件夹下新建一个全局组件入口文件 index.ts

// 引入自定义组件
import SvgIcon from './SvgIcon/SvgIcon.vue'

// 引入类型声明文件
import type { App, Component } from 'vue'

// 收集自定义组件名称
const allComponents: { [name: string]: Component } = { SvgIcon }
// 暴露方法
export default {
  // 安装组件
  install(app: App) {
    // 使用方法遍历组件
    Object.keys(allComponents).forEach((key: string) => {
      // 将组件挂载到app，为全局组件
      app.component(key, allComponents[key])
    })
  },
}

在 main.js 中

// 自定义全局组件文件
import gloablComponent from '@/components/index'

// 使用全局组件
app.use(gloablComponent)

需要的组件内就可以直接写组件标签名就行