vue-cli webpack 引入jquery的方法


Posted in jQuery onJanuary 10, 2018

今天费了一下午的劲,终于在vue-cli 生成的工程中引入了jquery,记录一下。(模板用的webpack)

首先在package.json里的dependencies加入"jquery" : "^2.2.3",然后install

在webpack.base.conf.js里加入

var webpack = require("webpack")

在module.exports的最后加入

plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
jQuery: "jquery",
$: "jquery"
})
]

然后一定要重新 run dev

在main.js 引入就ok了import $ from 'jquery'

下面看下vue 引入jquery的方法

1、npm 安装jquery

npminstall jquery --save

2、build/webpack.base.conf.js

plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
jQuery:"jquery",
$:"jquery"
 })]

3、main.js 中引入jquery

import $ from 'jquery'

4、eslint 

下一步就是要修改根目录下.eslintrc.js文件了,在改文件的module.exports中,为env添加一个键值对 jquery: true 就可以了

总结

以上所述是小编给大家介绍的vue-cli webpack 引入jquery的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
jQuery插件FusionWidgets实现的AngularGauge图效果示例【附demo源码】
Mar 23 jQuery
jQuery实现jQuery-form.js实现异步上传文件
Apr 28 jQuery
jQuery Ajax使用FormData上传文件和其他数据后端web.py获取
Jun 11 jQuery
jquery.rotate.js实现可选抽奖次数和中奖内容的转盘抽奖代码
Aug 23 jQuery
基于jQuery实现的单行公告活动轮播效果
Aug 23 jQuery
jquery 键盘事件的使用方法详解
Sep 13 jQuery
jQuery NProgress.js加载进度插件的简单使用方法
Jan 31 jQuery
jQuery实现标签子元素的添加和赋值方法
Feb 24 jQuery
jquery+php后台实现省市区联动功能示例
May 23 jQuery
通过jQuery学习js类型判断的技巧
May 27 jQuery
jQuery实现动态加载(按需加载)javascript文件的方法分析
May 31 jQuery
jQuery提示框插件SweetAlert用法分析
Aug 05 jQuery
jQuery第一次运行页面默认触发点击事件的实例
Jan 10 #jQuery
Vue+jquery实现表格指定列的文字收缩的示例代码
Jan 09 #jQuery
如何快速解决JS或Jquery ajax异步跨域的问题
Jan 08 #jQuery
jQuery+SpringMVC中的复选框选择与传值实例
Jan 08 #jQuery
JQuery实现table中tr上移下移的示例(超简单)
Jan 08 #jQuery
(模仿京东用户注册)用JQuery实现简单表单验证,初学者必看
Jan 08 #jQuery
jQuery+CSS实现的table表格行列转置功能示例
Jan 08 #jQuery
You might like
PHP 文本文章分页代码 按标记或长度(不涉及数据库)
2012/06/07 PHP
php+mysql大量用户登录解决方案分析
2014/12/29 PHP
浅析Yii2中GridView常见操作
2016/04/22 PHP
PHP实现JS中escape与unescape的方法
2016/07/11 PHP
PHP实现表单提交数据的验证处理功能【防SQL注入和XSS攻击等】
2017/07/21 PHP
JavaScript中获取未知对象属性的代码
2011/04/27 Javascript
js分页代码分享
2014/04/28 Javascript
JavaScript实现同一页面内两个表单互相传值的方法
2015/08/12 Javascript
JavaScript获取服务器端时间的方法
2016/11/29 Javascript
js 获取元素的具体样式信息getcss(实例讲解)
2017/07/05 Javascript
nodejs async异步常用函数总结(推荐)
2017/11/17 NodeJs
Node.js原生api搭建web服务器的方法步骤
2019/02/15 Javascript
基于JavaScript获取base64图片大小
2019/10/18 Javascript
详解JavaScript之Array.reduce源码解读
2020/11/01 Javascript
解决Python传递中文参数的问题
2015/08/04 Python
浅谈django开发者模式中的autoreload是如何实现的
2017/08/18 Python
利用python解决mysql视图导入导出依赖的问题
2017/12/17 Python
OpenCV+Python3.5 简易手势识别的实现
2020/12/21 Python
css3的transition效果和transfor效果示例介绍
2013/10/30 HTML / CSS
H5最强接口之canvas实现动态图形功能
2019/05/31 HTML / CSS
PurCotton全棉时代官网:100%天然棉花生产的生活护理用品
2016/11/18 全球购物
error和exception有什么区别
2012/10/02 面试题
鲜果饮品店创业计划书
2014/01/21 职场文书
国贸专业的职业规划范文
2014/01/23 职场文书
优秀员工推荐信
2014/05/10 职场文书
副职竞争上岗演讲稿
2014/05/12 职场文书
公司应聘自荐书
2014/06/14 职场文书
拾金不昧锦旗标语
2014/06/27 职场文书
优秀党员学习焦裕禄精神思想汇报范文
2014/09/10 职场文书
世界气象日活动总结
2015/02/27 职场文书
宾馆安全管理制度
2015/08/06 职场文书
一文读懂navicat for mysql基础知识
2021/05/31 MySQL
HTML5页面音频自动播放的实现方式
2021/06/21 HTML / CSS
WebWorker 封装 JavaScript 沙箱详情
2021/11/02 Javascript
MySQL七大JOIN的具体使用
2022/02/28 MySQL
服务器nginx权限被拒绝解决案例
2022/09/23 Servers