在vue项目中,将juery设置为全局变量的方法


Posted in Javascript onSeptember 25, 2018

1.首先执行:npm install jQuery --save-dev,在package.json里加入jQuery。

2.修改build下的webpack.base.conf.js

方法一:

首先加入:

const webpack = require("webpack")

然后在module.exports 对象中加入:

在vue项目中,将juery设置为全局变量的方法

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

方法二:

先加入:

const webpack = require("webpack")

然后:

resolve: {
 extensions: ['.js', '.vue', '.json'],
 alias: {
  'vue$': 'vue/dist/vue.esm.js',
  '@': resolve('src'),
  'jquery': 'jquery'
 }
 },

最后:

plugins: [
 new webpack.ProvidePlugin({
  jQuery: "jquery",
  $: "jquery"
 })
 ]

3.在app.vue中调用jquery

mounted: function() {
 console.log($);
 console.log($('#ss')[0].innerHTML);
 },

打印结果:

在vue项目中,将juery设置为全局变量的方法

以上这篇在vue项目中,将juery设置为全局变量的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
解决使用attachEvent函数时,this指向被绑定的元素的问题的方法
Aug 13 Javascript
JQuyer $.post 与 $.ajax 访问WCF ajax service 时的问题需要注意的地方
Sep 20 Javascript
AngularJS基础学习笔记之指令
May 10 Javascript
JQuery DIV 动态隐藏和显示的方法
Jun 23 Javascript
Bootstrap图片轮播组件Carousel使用方法详解
Oct 20 Javascript
JavaScript错误处理和堆栈追踪详解
Apr 18 Javascript
解决vue-cli中stylus无法使用的问题方法
Jun 19 Javascript
jQuery实现鼠标响应式透明度渐变动画效果示例
Feb 13 jQuery
json字符串传到前台input的方法
Aug 06 Javascript
JS使用new操作符创建对象的方法分析
May 30 Javascript
关于引入vue.js 文件的知识点总结
Jan 28 Javascript
package.json各个属性说明详解
Mar 11 Javascript
解决vue A对象赋值给B对象,修改B属性会影响到A的问题
Sep 25 #Javascript
解决vue-cli webpack打包后加载资源的路径问题
Sep 25 #Javascript
详解Vue Elementui中的Tag与页面其它元素相互交互的两三事
Sep 25 #Javascript
axios对请求各种异常情况处理的封装方法
Sep 25 #Javascript
解决vue axios的封装 请求状态的错误提示问题
Sep 25 #Javascript
angular 数据绑定之[]和{{}}的区别
Sep 25 #Javascript
Vue高版本中一些新特性的使用详解
Sep 25 #Javascript
You might like
Amazon Prime Video平台《无限住人 -IMMORTAL-》2020年开始TV放送!
2020/03/06 日漫
php header示例代码(推荐)
2010/09/08 PHP
PHP批量上传图片的具体实现方法介绍.
2014/02/26 PHP
PHP编程求最大公约数与最小公倍数的方法示例
2017/05/29 PHP
PHP时间日期增减操作示例【date strtotime实现加一天、加一月等操作】
2018/12/21 PHP
详解将数据从Laravel传送到vue的四种方式
2019/10/16 PHP
Laravel5.1 框架Middleware中间件基本用法实例分析
2020/01/04 PHP
parentElement,srcElement的使用小结
2014/01/13 Javascript
AngularJS入门教程之 XMLHttpRequest实例讲解
2016/07/27 Javascript
完美解决jQuery fancybox ie 无法显示关闭按钮的问题
2016/11/29 Javascript
JS基于面向对象实现的拖拽功能示例
2016/12/20 Javascript
使用puppeteer爬取网站并抓出404无效链接
2018/12/20 Javascript
微信小程序实现轨迹回放的示例代码
2019/12/13 Javascript
[02:23]2016国际邀请赛中国区预选赛wings晋级之路
2016/06/29 DOTA
详解设计模式中的工厂方法模式在Python程序中的运用
2016/03/02 Python
基于scrapy的redis安装和配置方法
2018/06/13 Python
Python图像滤波处理操作示例【基于ImageFilter类】
2019/01/03 Python
简单了解python 生成器 列表推导式 生成器表达式
2019/08/22 Python
Python3 合并二叉树的实现
2019/09/30 Python
如何提高python 中for循环的效率
2020/04/15 Python
Django自定义YamlField实现过程解析
2020/11/11 Python
装上这 14 个插件后,PyCharm 真的是无敌的存在
2021/01/11 Python
python 实现的车牌识别项目
2021/01/25 Python
国际书籍零售商:Wordery
2017/11/01 全球购物
注塑工厂厂长岗位职责
2013/12/02 职场文书
开办加工厂创业计划书
2014/01/03 职场文书
咖啡店自主创业商业计划书
2014/01/22 职场文书
写好自荐信需做到的5要点
2014/03/07 职场文书
成品库仓管员岗位职责
2014/04/06 职场文书
会计系毕业生求职信
2014/05/28 职场文书
工作态度怎么写
2015/06/25 职场文书
公司老总年会致辞
2015/07/30 职场文书
高中体育课教学反思
2016/02/16 职场文书
靠谱的活动总结
2019/04/16 职场文书
2019年行政人事个人工作总结范本!
2019/07/19 职场文书
php引用传递
2021/04/01 PHP