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插件FusionCharts实现的MSBar2D图效果示例【附demo源码】
Mar 24 jQuery
使用jQuery实现动态添加小广告
Jul 11 jQuery
jQuery选取所有复选框被选中的值并用Ajax异步提交数据的实例
Aug 04 jQuery
jQuery UI 实例讲解 - 日期选择器(Datepicker)
Sep 18 jQuery
jquery 一键复制到剪切板的实例
Sep 20 jQuery
认识jQuery的Promise的具体使用方法
Oct 10 jQuery
jQuery+CSS实现的标签页效果示例【测试可用】
Aug 14 jQuery
jQuery点击页面其他部分隐藏下拉菜单功能
Nov 27 jQuery
jquery-ui 进度条功能示例【测试可用】
Jul 25 jQuery
jQuery 添加元素和删除元素的方法
Jul 15 jQuery
Jquery Fade用法详解
Nov 06 jQuery
JavaScript枚举选择jquery插件代码实例
Nov 17 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
自己动手,丰衣足食 - 短波框形天线制作
2021/03/01 无线电
PHP 数组遍历方法大全(foreach,list,each)
2010/06/30 PHP
php strrpos()与strripos()函数
2013/08/31 PHP
PHP使用curl模拟post上传及接收文件的方法
2016/03/04 PHP
mac系统下为 php 添加 pcntl 扩展
2016/08/28 PHP
解析PHP之提取多维数组指定列的方法
2017/01/03 PHP
php头像上传预览实例代码
2017/05/02 PHP
javascript实现div的拖动并调整大小类似qq空间个性编辑模块
2012/12/12 Javascript
jquery Ajax 实现加载数据前动画效果的示例代码
2014/02/07 Javascript
jquery 取子节点及当前节点属性值的方法
2014/08/24 Javascript
60行js代码实现俄罗斯方块
2015/03/31 Javascript
javascript单例模式的简单实现方法
2015/07/25 Javascript
AngularJS中实现显示或隐藏动画效果的方式总结
2015/12/31 Javascript
使用JS正则表达式 替换括号,尖括号等
2016/11/29 Javascript
canvas学习之API整理笔记(一)
2016/12/29 Javascript
JavaScript中Promise的使用详解
2017/02/26 Javascript
Bootstrap标签页(Tab)插件使用方法
2017/03/21 Javascript
JS实现留言板功能[楼层效果展示]
2017/12/27 Javascript
vue数据操作之点击事件实现num加减功能示例
2019/01/19 Javascript
Vue运用transition实现过渡动画
2019/05/06 Javascript
webpack3升级到webpack4遇到问题总结
2019/09/30 Javascript
JS获取当前时间戳方法解析
2020/08/29 Javascript
利用Python-iGraph如何绘制贴吧/微博的好友关系图详解
2017/11/02 Python
python定时利用QQ邮件发送天气预报的实例
2017/11/17 Python
Django开发的简易留言板案例详解
2018/12/04 Python
python3正则模块re的使用方法详解
2020/02/11 Python
解决Python中导入自己写的类,被划红线,但不影响执行的问题
2020/07/13 Python
详解Python利用configparser对配置文件进行读写操作
2020/11/03 Python
新闻专业学生的自我评价
2014/02/13 职场文书
毕业生个人求职自荐信
2014/02/26 职场文书
网站创业计划书
2014/04/30 职场文书
建设幸福中国演讲稿
2014/09/11 职场文书
学生检讨书如何写
2014/10/30 职场文书
2016元旦主持人经典开场白台词
2015/12/03 职场文书
MySQL中的布尔值,怎么存储false或true
2021/06/04 MySQL
bat批处理之字符串操作的实现
2022/03/16 Python