一翘骂、本質(zhì)
造輪子有滑，給Vue生態(tài)圈提供更多優(yōu)良的插件或工具
插件通常用來為 Vue 添加全局功能娄琉。插件的功能范圍沒有嚴(yán)格的限制——一般有下面幾種：
1往果、添加全局方法或者 property。如：vue-custom-element
2喂柒、添加全局資源：指令/過濾器/過渡等不瓶。如?vue-touch
3禾嫉、通過全局混入來添加一些組件選項(xiàng)。如?vue-router
4蚊丐、 添加 Vue 實(shí)例方法熙参，通過把它們添加到?Vue.prototype?上實(shí)現(xiàn)。
5麦备、一個(gè)庫孽椰，提供自己的 API，同時(shí)提供上面提到的一個(gè)或多個(gè)功能凛篙。如?vue-router
二黍匾、使用插件
通過全局方法?Vue.use()?使用插件。它需要在你調(diào)用?new Vue()?啟動(dòng)應(yīng)用之前完成：
// 調(diào)用 `MyPlugin.install(Vue)`
Vue.use(MyPlugin)
newVue({
// ...組件選項(xiàng)
})
也可以傳入一個(gè)可選的選項(xiàng)對(duì)象：
Vue.use(MyPlugin, {someOption:true})
Vue.use?會(huì)自動(dòng)阻止多次注冊(cè)相同插件呛梆，屆時(shí)即使多次調(diào)用也只會(huì)注冊(cè)一次該插件锐涯。
Vue.js 官方提供的一些插件 (例如?vue-router) 在檢測(cè)到?Vue?是可訪問的全局變量時(shí)會(huì)自動(dòng)調(diào)用?Vue.use()。然而在像 CommonJS 這樣的模塊環(huán)境中填物，你應(yīng)該始終顯式地調(diào)用?Vue.use()：
// 用 Browserify 或 webpack 提供的 CommonJS 模塊環(huán)境時(shí)
var Vue =require('vue')
var VueRouter = require('vue-router')
// 不要忘了調(diào)用此方法
Vue.use(VueRouter)
awesome-vue?集合了大量由社區(qū)貢獻(xiàn)的插件和庫纹腌。
三、開發(fā)插件
Vue.js 的插件應(yīng)該暴露一個(gè)?install?方法滞磺。這個(gè)方法的第一個(gè)參數(shù)是?Vue?構(gòu)造器升薯，第二個(gè)參數(shù)是一個(gè)可選的選項(xiàng)對(duì)象：
MyPlugin.install = function(Vue, options){
? // 1. 添加全局方法或property?
Vue.myGlobalMethod = function(){
? ? // 邏輯...? }
? // 2. 添加全局資源?
Vue.directive('my-directive', {
? ? bind (el, binding, vnode, oldVnode) {
? ? ? // 邏輯...? ? }
? ? ...
? })
? // 3. 注入組件選項(xiàng)?
Vue.mixin({
? ? created: function(){
? ? ? // 邏輯...? ? }
? ? ...
? })
? // 4. 添加實(shí)例方法?
Vue.prototype.$myMethod = function(methodOptions){
? ? // 邏輯...? }
}
