Vue-cli4.x中Jquery的引入及使用

最新推荐文章于 2023-02-03 18:08:10 发布
最新推荐文章于 2023-02-03 18:08:10 发布
阅读量1k 收藏 1
点赞数 4
分类专栏： 前端 文章标签： vue npm jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_43620423/article/details/107740359
版权
本文详细介绍了在Vue-cli4.x环境下如何通过npm安装Jquery，并创建vue.config.js进行配置，使得Jquery成功引入到Vue项目中，实现无缝使用。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

一、安装Jquery

进入到项目所在目录之后使用npm进行安装，

npm install jquery --save

安装之后就会发现在package.json中已经引入了jquery依赖
在这里插入图片描述

二、进行配置

由于是Vue-cli4.x，所以在文件目录中并没有build文件夹，所以需要手动在根目录新建vue.config.js文件来进行配置
在这里插入图片描述

const webpack = require('webpack')

module.exports =
最低0.47元/天 解锁文章
Vue组件中引入jQuery
m0_63174618的博客
04-12 2798
打开全栈工匠技能包-1小时轻松掌握SSR两小时精通jq+bs插件开发生产环境下如歌部署Node.js网易内部VUE自定义插件库NPM集成谁说前端不用懂安全，XSS跨站脚本的危害webpack的loader到底是什么样的？两小时带你写一个自己loader。
【vue-cli搭建vue项目的过程2.x】
最新发布
qq_23128255的博客
05-21 473
搭建vue项目、eslint代码规范
Vue引入jQuery
weixin_30672295的博客
07-30 135
1.在项目中安装jquery 　　npm install jquery --save-dev 或者 打开package.json文件，在里面加入这行代码，jquery后面的是版本，根据你自己需求更改。 dependencies:{ 　　　　"jquery":"^2.2.3" } 然后在命令行输入 npm install 或者 cnpm ins...
vue cli4中写入jQuery
weixin_44500533的博客
10-28 2991
npm install jquery --save 新版本不用配置其他的 import $ from 'jquery' 直接写入　jquery语法 methods: { slide() { $('.introduce').slideUp('slow'); $('.introduce').addClass("up"); event....
vue-cli4最新版中怎么引入jQuery
weixin_45000814的博客
06-12 5631
我们要在vue-cli4最新版中引入jquery主要有以下三个步骤 1.安装jquery 2. 添加vue.config.js文件 3. 引入jquery 首先第一步先安装jQuery npm install jquery --save 或者 npm i jquery --save 第二步添加vue.config.js文件 因为最新版的vue-cli脚手架创建的项目文件夹中没有build文件夹，同时也没有webpack.base.config.js配置文件，但是我们可以在项目根文件目录下创建一个v
vue 中引入 jquery
且听风吟的博客
02-03 3049
vue 中引入 jquery
vue-cli webpack 引入jquery的方法
11-28
今天费了一下午的劲，终于在vue-cli 生成的工程中引入了jquery，记录一下。(模板用的webpack) 首先在package.json里的dependencies加入”jquery” : “^2.2.3″，然后install 在webpack.base.conf.js里加入 var ...
vue-cli 引入jQuery，Bootstrap，popper的方法
10-18
需要注意的是，在模块中使用这些库时，应该直接使用`$`或`jQuery`而不是`require('jquery')`，因为通过`ProvidePlugin`插件已经全局引入了这些变量。 最后，是关于`webpack.base.conf.js`配置文件的一些其他配置项...
vue引入jquery
八佾舞于庭
10-30 258
webpack.base.conf.js加入var webpack = require("webpack"); module.exports加入： plugins: [ new webpack.ProvidePlugin({ jQuery: "jquery", $: "jquery" }) ] 然后 npm  run dev   ；import $ from 'jquery'是必...
vue引入 jquery
Artistic Life
08-22 244
本人 web 菜到极致, 目前所做笔记都是基于应用, 原理一概不知…啊… 项目主要位置: 先打开 package.json “dependencies”: { “jquery”: “^3.3.1” }, 在 dependencies中添加 jquery 然后进入项目目录执行 npm install jquery –save-dev build文件夹下的w...
vue 引入jquery
卓力的博客
03-12 419
1.package.json 文件引入 jquery "jquery":"^3.2.1" 2. npm install 下载jquery文件 3.webpack.base.conf.js 文件引入 constwebpack=require('webpack'); jQuery:"jquery", $:"jquery", 4.main.js全局引入import$from'jquery' 5.直接使用$(".weui-cells...
vue 引入 jquery
qq_45021462的博客
01-21 4633
vue中引入jquery 安装jquery包 npm install jquery --save 配置vue.config.js const webpack = require('webpack'); module.exports = { configureWebpack: { plugins: [ new webpack.ProvidePlugin({ $: "jquery", jQuery: "jquery", "win
vue引入jQuery
maJieweb的博客
05-19 1383
vue引入jQuery
Vue引入JQuery
冷心为上
10-30 259
一、npm安装保存JQuery npm install jquery --save-dev 二、webpack.base.conf.js文件中添加引用 最开始添加 const webpack=require('webpack') module.exports中添加 plugins: [ new webpack.ProvidePlugin({ jQuery: "...
Vue 中引入jquery
Web前端工程师
03-04 413
npm i jquery -S //然后再vue页面中引入jquery就可以使用了 import $ from 'jquery'
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值