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正则表达式在页面验证url网址输入是否正确
Apr 04 jQuery
jQuery实现百度登录框的动态切换效果
Apr 21 jQuery
jQuery实现鼠标滑过预览图片大图效果的方法
Apr 26 jQuery
jQuery 中msgTips 顶部弹窗效果实现代码
Aug 14 jQuery
jQuery实现简单的计时器功能实例分析
Aug 29 jQuery
jQuery选择器之子元素选择器详解
Sep 18 jQuery
jQuery+SpringMVC中的复选框选择与传值实例
Jan 08 jQuery
基于jQuery.i18n实现web前端的国际化
May 04 jQuery
jQuery 导航自动跟随滚动的实现代码
May 30 jQuery
jQuery实现动态生成年月日级联下拉列表示例
May 11 jQuery
JQuery的加载和选择器用法简单示例
May 13 jQuery
解决jquery validate 验证不通过后验证正确的信息仍残留在label上的方法
Aug 27 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在网页中动态生成PDF文件详细教程
2014/07/05 PHP
如何让thinkphp在模型中自动完成session赋值小教程
2014/09/05 PHP
php实现文件上传基本验证
2020/03/04 PHP
js不是基础的基础
2006/12/24 Javascript
Jquery 设置标题的自动翻转
2009/10/03 Javascript
在UpdatePanel内jquery easyui效果失效的解决方法
2010/04/11 Javascript
IFrame跨域高度自适应实现代码
2012/08/16 Javascript
JavaScript基础教程之alert弹出提示框实例
2014/10/16 Javascript
Bootstrap每天必学之标签页(Tab)插件
2020/08/09 Javascript
JS实现颜色梯度与渐变效果完整实例
2016/12/30 Javascript
利用node.js搭建简单web服务器的方法教程
2017/02/20 Javascript
浅谈Angular文字折叠展开组件的原理分析
2017/11/24 Javascript
vue项目关闭eslint校验
2018/03/21 Javascript
angular 服务的单例模式(依赖注入模式下)详解
2018/10/22 Javascript
简单使用webpack打包文件的实现
2019/10/29 Javascript
JS实现音量控制拖动
2020/01/15 Javascript
vue-cli3项目打包后自动化部署到服务器的方法
2020/09/16 Javascript
原生js实现点击按钮复制内容到剪切板
2020/11/19 Javascript
python两种遍历字典(dict)的方法比较
2014/05/29 Python
Python数据可视化正态分布简单分析及实现代码
2017/12/04 Python
django如何连接已存在数据的数据库
2018/08/14 Python
Python Pexpect库的简单使用方法
2019/01/29 Python
python如何实现不用装饰器实现登陆器小程序
2019/12/14 Python
python使用QQ邮箱实现自动发送邮件
2020/06/22 Python
利于python脚本编写可视化nmap和masscan的方法
2020/12/29 Python
IE兼容css3圆角的实现代码
2011/07/21 HTML / CSS
兰蔻加拿大官方网站:Lancome加拿大
2016/08/05 全球购物
办公室文秘自我评价
2013/09/21 职场文书
求职信的要素有哪些呢
2013/12/26 职场文书
大学军训通讯稿
2014/01/13 职场文书
大学生社会实践方案
2014/05/11 职场文书
文明城市标语
2014/06/16 职场文书
迎国庆演讲稿
2014/09/05 职场文书
2014年环保局工作总结
2014/12/11 职场文书
思想品德评语大全
2014/12/31 职场文书
图文详解nginx日志切割的实现
2022/01/18 Servers