vue2 html引入jquery,Vue添加引入jquery插件

一、现象

综合开发需要,需要引用使用

二、解决

1、先安装jquer插件,命令运行:

npm i jquery --save-dev

(tips:  i  也就是 install --save-dev为添加到package.json)

2、利用 expose-loader 模块 来引用jquery插件 ,命令运行:

npm i expose-loade --save-dev

3、配置webpack.base.conf,在其中添加 ‘jquery‘: path.resolve(__dirname, ‘../node_modules/jquery/dist/jquery.min‘),如图:

9c99d3c91a719086e73da4ed2b389e29.png

4、同时配置依赖,代码 :

{

test: require.resolve(‘jquery‘),

use: [{

loader: ‘expose-loader‘,

options: ‘$‘

}]

}

如图:

fa562495062a9450df5b87cdb93cd933.png

佛山vi设计https://www.houdianzi.com/fsvi/ 豌豆资源搜索大全https://55wd.com

5、使用,在需要使用的页面引用,代码:

const $ = require(‘jquery‘)

在控制台进行测试打印,代码如:

console.log($(this).hasClass(‘testClass‘))

如果打印为 flase ,恭喜您,成功了。

(tips: 为什么说成功呢,因为 $(this).hasClass(‘testClass‘)  是用来判断当前元素是否存在testClass 这样一个名的class)

原文:https://www.cnblogs.com/xiaonian8/p/13831353.html

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值