对于一些基础的组件，比如输入框，下拉选择框，使用的频率很高。我们没有必要在每一个需要的地方使用。而是采取在根组件中注册。根组件中的注册是全局注册。全局注册了之后就可以在根组件下的任何子组件中使用。

根组件代码如下：

//注意必须在构建Vue实例之前就将需要的组件注册进去
Vue.use(plugins);

Vue.config.productionTip = false

new Vue({
router,
store,
render: h => h(App)
}).$mount(’#app’)
" title="" data-original-title=“复制”>

import Vue from ‘vue’

import App from ‘./App.vue’

import router from ‘./router’

import store from ‘./store’

import plugins from ‘./components/common/index’

//注意必须在构建Vue实例之前就将需要的组件注册进去
Vue.use(plugins);

Vue.config.productionTip = false

new Vue({
router,
store,
render: h => h(App)
}).$mount(’#app’)

plugins函数的代码：

function plugins(Vue) {
Vue.component("componen-a", ComponentA);
Vue.component("componen-b", ComponentB);
Vue.component("componen-c", ComponentC);
}

export default plugins;" title="" data-original-title=“复制”>

import ComponentA from “./ComponentA”;

import ComponentB from “./ComponentB”;

import ComponentC from “./ComponentC”;

function plugins(Vue) {
Vue.component(“componen-a”, ComponentA);
Vue.component(“componen-b”, ComponentB);
Vue.component(“componen-c”, ComponentC);
}

export default plugins;

ComponentA，ComponentB，ComponentC组件很简单，逻辑完全一样，以ComponentA为例：

this is component a

" title="" data-original-title=“复制”>

<template>

<div>this is component a</div>

</template>

<script>
export default {
name: “component-a”
}
</script>

<style>

</style>

之后就可以在根组件下的任何组件中使用ComponentA，ComponentB，ComponentC。
以HelloWorld组件为例：

" title="" data-original-title=“复制”>

<template>

<div class=“hello”>

<componen-a></componen-a>

<componen-b></componen-b>

<componen-c></componen-c>

</div>

</template>

<script>
export default {
name: ‘HelloWorld’,
props: {
msg: String
}
}
</script>

<!-- Add “scoped” attribute to limit CSS to this component only -->
<style scoped>
</style>

注意在引入ComponentA组件的时候，我们引入的方式是<componen-a>，这和之前定义是相互呼应的：
Vue.component("componen-a", ComponentA);

这里最核心的是Vue.use(plugins);这段代码到底都干了什么？

function plugins(Vue) {
  Vue.component("componen-a", ComponentA);
  Vue.component("componen-b", ComponentB);
  Vue.component("componen-c", ComponentC);
}

方法plugins接受一个参数Vue，这个参数是从哪里来的。这一切都藏在Vue.use这个方法属性当中。
Vue.use采取来什么样的设计模块。这是下一篇需要关注的问题。