Vue中创建全局组件，并且使用Vue.use() 载入。

自定义vue组件，一般是局部引用的方式载入，使用的时候，在应用的组件中使用 import moduleName from ‘module’ 导入，在components中注册

那么如果某个组件经常复用，岂不是每次在新组建中引用都要导入一次吗？是的 。这种情况下可以将组件封装成全局组件，一次导入之后，全局都可以使用。
1.首先创建一个文件夹loading
用来保存需要全局引用的组件，并且存放一些配置文件。

2.创建一个loading.vue的组件。
该组件中除了组件的基础结构，并无其他内容。它的作用是用来加载准备自定义的组件，最后将loading组件加载到全局的Vue中，这样就一次性完成了所有自定义组件的加载，非常方便。

3.创建自定义组件
这里以一个简单封装的mint-ui轮播图为例。

4.创建index.js，用来导出所有自定义组件。
import turns from './turns.vue'

const loading = {
  install: function (Vue) {
    Vue.component('turns', turns)
  }
}

export default loading;

其实到这里组件封装就结束了，下面再演示下如何使用。

5.在main.js中，导入并使用loading组件。
import loading from './lib/loading';

Vue.use(loading);

这样就将组件全局引用成功了！

6.在需要使用的地方，直接使用组件名即可。

通过这种方式，就能实现组件的全局引用。
这种做的好处是对于复用性非常高的组件，省去了每次导入的麻烦；
缺点是无法直观的看到组件引入和注册，对于不清楚的人来说看不懂组件名的意义。

===============备注===================

该文可以清晰解释为什么引用模块loading 的时候，使用的是标签turns ，其实是一个包含关系，即组件库名和单个组件名。就好像你引入了elementUI组件库，具体使用哪个组件就是用该组件的标签。
作者：SilenceJude 
来源：CSDN 
原文：https://blog.csdn.net/SilenceJude/article/details/85088764 
版权声明：本文为博主原创文章，转载请附上博文链接！