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动态追加页面数据以及事件委托详解
May 06 jQuery
jQuery滑动到底部加载下一页数据的实例代码
May 22 jQuery
jQuery选择器特殊字符与属性空格问题
Aug 14 jQuery
jQuery选择器之表单元素选择器详解
Sep 19 jQuery
jquery+css3实现熊猫tv导航代码分享
Feb 12 jQuery
jquery引入外部CDN 加载失败则引入本地jq库
May 23 jQuery
jQuery实现表单动态加减、ajax表单提交功能
Jun 08 jQuery
jQuery 获取除某指定对象外的其他对象 ( :not() 与.not())
Oct 10 jQuery
jQuery轻量级表单模型验证插件
Oct 15 jQuery
jquery获取img的src值实例介绍
Jan 16 jQuery
基于Bootstrap和JQuery实现动态打开和关闭tab页的实例代码
Jun 10 jQuery
JQuery常用选择器功能与用法实例分析
Dec 23 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的ob_start() 控制您的浏览器cache
2009/08/03 PHP
php中switch与ifelse的效率区别及适用情况分析
2015/02/12 PHP
php调用KyotoTycoon简单实例
2015/04/02 PHP
CodeIgniter集成smarty的方法详解
2016/05/26 PHP
PHP自定义函数格式化json数据示例
2016/09/14 PHP
PHP两种实现无级递归分类的方法
2017/03/02 PHP
laravel框架模板之公共模板、继承、包含实现方法分析
2019/08/30 PHP
在视频前插入广告
2006/11/20 Javascript
永不消失的title提示代码
2007/02/15 Javascript
js对table的td进行相同内容合并示例详解
2013/12/27 Javascript
extjs 时间范围选择自动判断的实现代码
2014/06/24 Javascript
Nodejs学习笔记之Stream模块
2015/01/13 NodeJs
基于jQuery Circlr插件实现产品图片360度旋转
2015/09/20 Javascript
JS组件中bootstrap multiselect两大组件较量
2016/01/26 Javascript
JavaScript实现解析INI文件内容的方法
2016/11/17 Javascript
javascript实现数据双向绑定的三种方式小结
2017/03/09 Javascript
webpack学习教程之publicPath路径问题详解
2017/06/17 Javascript
python实现在pickling的时候压缩的方法
2014/09/25 Python
Python中集合的内建函数和内建方法学习教程
2015/08/19 Python
基础的十进制按位运算总结与在Python中的计算示例
2016/06/28 Python
python中int与str互转方法
2018/07/02 Python
Django框架多表查询实例分析
2018/07/04 Python
Django打印出在数据库中执行的语句问题
2019/07/25 Python
在pycharm中显示python画的图方法
2019/08/31 Python
Python 类,property属性(简化属性的操作),@property,property()用法示例
2019/10/12 Python
python3读取csv文件任意行列代码实例
2020/01/13 Python
Python同时处理多个异常的方法
2020/07/28 Python
HTML5标签嵌套规则详解【必看】
2016/04/26 HTML / CSS
慕尼黑山地运动、户外服装和体育用品专家:Sporthaus Schuster
2019/08/27 全球购物
岗位职责范本
2013/11/23 职场文书
会议开场欢迎词
2014/01/15 职场文书
心理学专业大学生职业生涯规划范文
2014/02/19 职场文书
读书小明星事迹材料
2014/05/03 职场文书
美食节策划方案
2014/05/26 职场文书
党员干部作风建设思想汇报范文
2014/10/25 职场文书
Python实现PIL图像处理库绘制国际象棋棋盘
2021/07/16 Python