vuejs如何引入插件

這篇文章主要介紹了vuejs如何引入插件，具有一定借鑒價(jià)值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

引入方法：1、在“main.js”中使用import和“Vue.use(..)”語句；2、在vue文件的script標(biāo)簽內(nèi)添加“import '路徑”語句；3、在“app.vue”中使用import和“components:{}”語句等等。

本教程操作環(huán)境：windows7系統(tǒng)、vue2.9.6版，DELL G3電腦。

第一步：install ，手動下載，自定義插件，網(wǎng)址訪問

一般的vue或是js插件，通常都可以直接install，然后進(jìn)行下一步。但是不排除各種原因install失敗，需要手動下載。還有一部分是自定義的插件。

第二步：引入插件

js全局引入

main.js文件添加

import Loading from './components/loading'
Vue.use(Loading)

js單獨(dú)引入

vue文件script標(biāo)簽內(nèi)添加

import '../../../components/loading/index.js'

vue全局引入

vue一般都是導(dǎo)入js再引入的，所以引入方式與js相同。但存在特殊情況，比如引入導(dǎo)航欄，直接是vue引入，全局是在app.vue中添加

import Header from './components/Header'
components: {
    Header
  }

vue單獨(dú)引入

單獨(dú)引入也是添加上述代碼

直接引入

1，在項(xiàng)目的index.html添加

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=？"></script>

2，build/webpack.base.conf.js的配置文件中，設(shè)置外部擴(kuò)展(externals屬性)

externals: {
    'BaiduMap': 'BMap'
}

模塊化引入

同js全局引入，此部分要求插件可安裝或下載

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享的“vuejs如何引入插件”這篇文章對大家有幫助，同時也希望大家多多支持億速云，關(guān)注億速云行業(yè)資訊頻道，更多相關(guān)知識等著你來學(xué)習(xí)!