Vue中的组件和插件有什么区别?

一、理解组件和插件

组件 （component）: 简单来说，在vue中每一个.vue文件都可以当作一个组件

组件的优点：

（1）降低整个系统的耦合性，在保持接口不变的情况下，可以替换不同的组件快速完成开发

（2）调试排错方便，由于整个系统是由不同组件组合而成，当出现报错的时候，可以通过移出组件进行排查，或者根据报错组件快速实现定位，因为组件之间的耦合性低，职责单一，逻辑分析比整个系统要简单

（3）提高可维护性，由于每个组件的职责单一，并且组件在系统中是被复用的，所以对组件的代码进行优化可以让系统整体升级

插件（plugin）：本质上是对vue功能的增强和补充

插件通常用来为 Vue 添加全局功能。插件的功能范围没有严格的限制——一般有下面几种：

1. 添加全局方法或者 property。如：vue-custom-element

2. 添加全局资源：指令/过滤器/过渡等。如 vue-touch

3. 通过全局混入来添加一些组件选项。如 vue-router

4. 添加 Vue 实例方法，通过把它们添加到 Vue.prototype 上实现。

5. 一个库，提供自己的 API，同时提供上面提到的一个或多个功能。如 vue-router

二、区别

1.编写形式不同

组件的编写方式有很多种，常见的就是一个.vue文件就可以是一个组件；

vue插件的编写需要暴露一个Install方法，这个方法的第一个参数是Vue构造器，第二个参数是一个可选的选项对象

2.注册形式不同

vue组件注册主要分为全局注册与局部注册

(1)全局注册通过Vue.component方法，第一个参数是组件的名称，第二个参数是传入的配置项

Vue.component('组件名'，{  ......   })

(2)局部注册在哪里使用就在哪里引入，通过components属性注册就可以直接使用了

import 'my-component' from 'xxx/xxx/xxx'

export default {

components:{ myCom }

}

插件的注册通过Vue.use()的方式进行注册（安装），第一个参数为插件的名字，第二个参数是可选择的配置项

Vue.use('插件名'，{ ...... })

注意：

注册插件的时候，需要在调用 new Vue() 启动应用之前完成

Vue.use会自动阻止多次注册相同插件，只会注册一次

3.使用场景不同

组件 (Component) 是用来构成你的 App 的业务模块，它的目标是 App.vue

插件 (Plugin) 是用来增强你的技术栈的功能模块，它的目标是 Vue 本身