分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > IT知识

vue 中使用jquery

发布时间:2023-09-06 02:07责任编辑:赖小花关键词:暂无标签

1.安装jquery

npm install jquery --save

2.webpack配置

在项目根目录下的build目录下找到webpack.base.conf.js文件,在开头使用以下代码引入webpack,因为该文件默认没有引用,

var webpack = require(‘webpack‘)

然后在module.exports中添加一段代码,

// 原有代码
resolve: {

},
// 添加代码

??plugins: [
???new webpack.ProvidePlugin({
???????$: "jquery",
???????jQuery: "jquery"
???})
],
// 原有代码
module: {
?rules: [
// ......
?]
}

3.在main.js中导入jquery

import ‘jquery‘

4.在.vue文件中就可以操作dom了 console.log($(‘选择器‘)) 然后执行npm run dev

注意:如果你的项目装了eslint,可能会报一下的错误

但是编译却报错了:

http://eslint.org/docs/rules/no-undef ‘$‘ is not defined orhttp://eslint.org/docs/rules/no-undef ‘jQuery‘ is not defined

这时候需要做的下一步就是要修改根目录下.eslintrc.js文件了,在改文件的module.exports中,为env添加一个键值对 jquery: true
env: {
// 原有
???browser: true,
// 添加
???jquery: true
}
再次执行npm run dev 就可以啦
 

vue 中使用jquery

原文地址:https://www.cnblogs.com/zousaili/p/9392996.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved