快捷導(dǎo)航

Webpack+Vue如何導(dǎo)入Jquery和Jquery的第三方插件

更新時(shí)間：2017年02月20日 14:22:01 作者：小龍女先生

本文主要介紹了Webpack+Vue導(dǎo)入Jquery和Jquery的第三方插件的方法，具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧

創(chuàng)建一個(gè)jquery-vendor.js文件

import $ from 'jQuery';
console.log($);
window.$ = $;
window.jQuery = $;
export default $;

導(dǎo)入JQuery，并賦值給window對(duì)象，使其成為一個(gè)全局變量。

在vue組件做如下引用

import $ from './assets/jquery-v';
import 'bootstrap-material-design'; 
//調(diào)用初始化
$(function(){
 $.material.init();
});

注意：

1. 只可以在vue的組件中引用

2.如果在main.js中引入jquery.js是Ok的，但這種情況下無(wú)論是在mian.js或者是vue組件中引入jquery的第三方插件就有問(wèn)題了。

以上就是本文的全部?jī)?nèi)容，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助，同時(shí)也希望多多支持腳本之家！

您可能感興趣的文章:

相關(guān)文章

Electron+vue從零開始打造一個(gè)本地播放器的方法示例
這篇文章主要介紹了Electron+vue從零開始打造一個(gè)本地播放器的方法示例，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2020-10-10
詳解vue2.0模擬后臺(tái)json數(shù)據(jù)
這篇文章主要介紹了vue2.0模擬后臺(tái)json數(shù)據(jù)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-05-05
socket io與vue-cli的結(jié)合使用的示例代碼
這篇文章主要介紹了socket io與vue-cli的結(jié)合使用的示例代碼，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2018-11-11
el-date-picker時(shí)間清空值為null處理方案
本文介紹關(guān)于Vue.js項(xiàng)目中時(shí)間選擇器組件的問(wèn)題,當(dāng)選擇后清空導(dǎo)致值變?yōu)閚ull,進(jìn)而引發(fā)后臺(tái)接口報(bào)錯(cuò),通過(guò)監(jiān)聽`overallForm.time`的值并設(shè)置為空數(shù)組,成功解決此問(wèn)題,確保了數(shù)據(jù)正確性,同時(shí),建議避免直接監(jiān)聽整個(gè)對(duì)象以優(yōu)化性能,感興趣的朋友一起看看吧
2024-08-08
前端Vue設(shè)置cookie、刪除cookie,獲取cookie方式
這篇文章主要介紹了前端Vue設(shè)置cookie、刪除cookie，獲取cookie方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-10-10
vue如何點(diǎn)擊多個(gè)tab標(biāo)簽打開關(guān)閉多個(gè)頁(yè)面
這篇文章主要介紹了vue如何點(diǎn)擊多個(gè)tab標(biāo)簽打開關(guān)閉多個(gè)頁(yè)面，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-09-09
基于vue2.0實(shí)現(xiàn)仿百度前端分頁(yè)效果附實(shí)現(xiàn)代碼
本文通過(guò)實(shí)例代碼給大家介紹了基于vue2.0實(shí)現(xiàn)仿百度前端分頁(yè)效果,在文中給大家記錄了遇到的問(wèn)題及解決方法，需要的朋友可以參考下
2018-10-10
npm install sentry-cli失敗的問(wèn)題解決
本文主要介紹了npm install sentry-cli失敗的問(wèn)題解決,文章首先描述了問(wèn)題現(xiàn)象,然后分析了問(wèn)題的原因,具有一定的參考價(jià)值,感興趣的可以了解一下
2023-08-08
Vue-Router的使用方法
這篇文章主要介紹了Vue-Router的使用方法，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2018-09-09
使用typescript構(gòu)建Vue應(yīng)用的實(shí)現(xiàn)
這篇文章主要介紹了使用typescript構(gòu)建Vue應(yīng)用的實(shí)現(xiàn),文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-08-08