前端学习日记---Vue3全局组件插件化实现

创建js文件，在js文件中引入项目全局通用型组件，然后导出：代码示例如下：

// /在这里将components中所有的组件都进行全局化注册

//通过插件的方式

import DetailImage from '@/components/DetailImage/index.vue'

import xtxSku from '@/components/xtxSku/index.vue'

export const componentPlugin={

  install(app){

    // app.component('组件名字',组建配置对象)

    app.component('XtxImageView',DetailImage)

    app.component('XtxSku',xtxSku)

  }

}

随后在main.js中引入，使用即可，代码示例如下：

import {componentPlugin} from '@/components/index.js'

const app = createApp(App)

//引入全局组件插件并注册

app.use(componentPlugin)

以上即：完成了对通用型组件全局插件化