在vue中使用jquery

公司业务用到nodejs,vue,webpack等技术,最近正在学习中;遇到了一个这样的情况,在vue中需要使用jquery跟bootstrap的一些功能,特此记录.

全局引入jquery

首先vue init webpack projectname创建新的vue项目

进入项目目录后,npm install jquery --save,下载jquery依赖包

然后,在build目录的webpack.base.conf.js中加入一下代码

var webpack =require('webpack');

然后在module.exports最后添加以下代码:

plugins: [

new webpack.optimize.CommonsChunkPlugin('common.js'),

new webpack.ProvidePlugin({

jQuery: "jquery",

$: "jquery"

})

]

最后,在main.js中加入以下代码:

import $ from 'jquery'

 

以上,完成在vue中使用jquery的准备工作

可以在组件的钩子函数mounted(){}中测试看看$(选择器)是否抓取到dom元素