在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元素