Vue.use

参考文档

• vue2官网

疑问

使用 vue-router 等一些包的时候，需要在main.js中使用Vue.use(xxx)

原理

如果插件是一个对象，必须提供 install 方法。如果插件是一个函数，它会被作为 install 方法。install 方法调用时，会将 Vue 作为参数传入。

源码解析

// 路径：src\core\global-api\use.ts

Vue.use = function (plugin: Function | any) {
    // 判断是否已经安装过这个插件
    // installedPlugins 是一个数组，所有的插件都存放在 this._installedPlugins 中
    const installedPlugins =
      this._installedPlugins || (this._installedPlugins = [])
    if (installedPlugins.indexOf(plugin) > -1) {
      return this
    }

    // 安装插件
    // additional parameters
    // arguments 就是数组中的那个arguments
    const args = toArray(arguments, 1)
    // this 是 Vue实例
    args.unshift(this)
    if (isFunction(plugin.install)) {
      // 如果插件是一个对象，并且有 install 属性
      plugin.install.apply(plugin, args)
    } else if (isFunction(plugin)) {
      // 如果插件是一个函数，相当于默认是 install 函数
      // 将 Vue 作为 plugin 参数
      plugin.apply(null, args)
    }
    installedPlugins.push(plugin)
    return this
  }

实质是：Vue.use需要一个 install；如果 plugin 是对象就必须具备名称为 install 函数属性，否则会报错；如果是函数，那么函数就是 install 的内容

示例

// plugin 为函数
function test(Vue) {
    console.log(123);
}

Vue.use(test);

// plugin 为对象
const testInstall = {
  install: (Vue) => {
    console.log(456456);
  }
}
Vue.use(testInstall);

如有错误，感谢指正，谢谢。