Vue.js插件書寫規(guī)范

Vue插件書寫規(guī)范,導(dǎo)出install方法

使用時,可以通過以上主流寫法將自定義插件掛載到Vue上面:

import Vue from 'vue'
import YourPlugin from 'YourPlugin'
Vue.use(YourPlugin)

閉包里exports一個install方法

(function () {

  function install (Vue) {
    Vue.YourPlugin = function (options) {
      
    }
  }
// 這里為了支持CMD,AMD,CommonJs,以及script標簽導(dǎo)入的方式
  if (typeof exports == "object") {
    module.exports = install
  } else if (typeof define == "function" && define.amd) {
    define([], function(){ return install })
  } else if (window.Vue) {
    Vue.use(install)
  }

})()

至于為什么要這樣寫,為什么要導(dǎo)出install方法?相信大家肯定有疑問,這里摘錄Vue源碼的use方法,大家就能一目了然

Vue.use = function (plugin) {
    /* istanbul ignore if */
    if (plugin.installed) {
      return
    }
    // additional parameters
    var args = toArray(arguments, 1)
    args.unshift(this)
    if (typeof plugin.install === 'function') {
      plugin.install.apply(plugin, args)
    } else {
      plugin.apply(null, args)
    }
    plugin.installed = true
    return this
  }

當前后續(xù)最好將插件通過npm publish發(fā)布到npm包里面,這樣其他小伙伴就能通過以下方式直接安裝了

npm install YourPlugin
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 無意中看到zhangwnag大佬分享的webpack教程感覺受益匪淺,特此分享以備自己日后查看,也希望更多的人看到...
    小小字符閱讀 8,368評論 7 35
  • 前言 熱愛vue開發(fā)的同學(xué)肯定知道awesome-vue 這個github地址,里面包含了數(shù)以千計的vue開源插件...
    勞卜閱讀 11,787評論 2 57
  • 社會是以人為主的大關(guān)系網(wǎng)。而關(guān)系是最微妙的連接點。沒有足夠的了解與共處,簡單的一句話會引發(fā)各類歧義。每個人的生活習...
    燈火擾亂閱讀 187評論 0 0
  • 1. Jenkins介紹 Jenkins是基于java的自動化系統(tǒng)平臺(在servlet容器中運行,例如Tomca...
    Cassie測試路閱讀 7,776評論 5 2
  • Picture Krita KDE桌面的圖像處理軟件GIMP Linux下的PS 編輯器 Notepad++ At...
    Saber真是太可愛了閱讀 705評論 0 0

友情鏈接更多精彩內(nèi)容