VUE 引入外掛程式的區別

今天看自己專案**,引入外掛程式包的main.js，留意到引入包或者檔案有兩種方式：

import vue from

'vue'
import echarts from
'echarts'
import global from
'./global.js'
//我自己建立的全域性變數函式檔案
vue.prototype.$echarts=echarts;
vue.
use(global)

通過資料查詢，了解到：

1、不是為了vue寫的外掛程式(外掛程式內要處理)不支援vue.use()載入方式

2、非vue官方庫不支援new vue()方式

3、每乙個vue元件都是vue的例項，所以元件內this可以拿到vue.prototype上新增的屬性和方法。

其實我們知道vue.prototype是在原型上定義，使其在每個vue中的例項中可用，那麼vue.use()流程是怎麼走的？我們可以通過源**了解其過程：

建立自定義全域性函式global.js

// 全域性函式

exports.
install
=function
(vue, options)
return result;};
};

那麼，我們可以通過源**分析，了解vue.use()實現過程

export

function
inituse
(vue: globalapi)
// additional parameters
const args =
toarray
(arguments,1)
/*a*/
args.
unshift
(this)if
(typeof plugin.install ===
'function'
)elseif(
typeof plugin ===
'function'
) plugin.installed =
true
return
this
}}

Vue引入外掛程式

2.在src main.js中新增 1.在專案資料夾下,使用命令 npm install jquery s e dev 引入jquery.2.在bulid webpack.base.conf.js 中新增如下內容 3.在src main.js 檔案中引入 1.npm 安裝axios，檔案根目錄下安裝...

VUE引入第三方外掛程式

vue 引入第三方外掛程式方法 1 如果是第三方 npm 模組檔案 檔案統一放入src assets js 資料夾下 統一在main.js 內引入 import parse from assets js plugin.js import assets js plugin.js 2 如果是第三方非 n...

bootstrap引入外掛程式無效

在做乙個簡單的demo專案時，引入bootstrap的modal外掛程式，發現怎麼都沒有響應，經過查詢才了解到 bootstrap的外掛程式引入得先載入jquery的相關配置。so src static js jquery 3.2.1.min.js script href static bootst...