Vue插件

什么是插件

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

• 添加全局方法或者属性。如: vue-custom-element
• 添加全局资源：指令/过滤器/过渡等。如 vue-touch
• 通过全局混入来添加一些组件选项。如vue-router
• 添加 Vue 实例方法，通过把它们添加到 Vue.prototype 上实现
• 一个库，提供自己的 API，同时提供上面提到的一个或多个功能。如vue-router

import { createApp } from 'vue'

const app = createApp({})

app.use(myPlugin, {
  /* 可选的选项 */
})

插件编写

一个插件可以是一个拥有 install() 方法的对象，也可以直接是一个安装函数本身。安装函数会接收到安装它的应用实例和传递给 app.use() 的额外选项作为参数：

const myPlugin = {
  install(app, options) {
    // 配置此应用
  }
}

插件的使用场景

• 通过 app.component() 和 app.directive() 注册一到多个全局组件或自定义指令。

• 通过 app.provide() 使一个资源可被透传进整个应用。

• 向 app.config.globalProperties 中添加一些全局实例属性或方法

• 一个可能上述三种都包含了的功能库 (例如 vue-router)。