vue注册全局组件

233 阅读1分钟

目录结构:

test

    index.js

    product.vue

    

product.vue

<template>
  <div>
    hello world
  </div>
</template>

<script>
export default {
  name: "product"
}
</script>

<style scoped>

</style>

index.js

import product from "@/components/test/product";

const productCom = {
  install:function (Vue){
    Vue.component('el-product',product)
  }
}

export default productCom

main.js

import productCom from '@/components/test/index'
Vue.use(productCom) 

在home文件中引入

<template>
    <el-product></el-product>
</template>

<script>
export default {
  name: "Home"
}
</script>

<style scoped>

</style>