vue-cli中引入jquery

最新推荐文章于 2025-09-12 16:56:45 发布
最新推荐文章于 2025-09-12 16:56:45 发布
阅读量58 收藏
点赞数
CC 4.0 BY-SA版权
文章标签： javascript webpack ViewUI
原文链接：http://www.cnblogs.com/chenguangliang/p/6934053.html
本文介绍如何解决Vue项目中引入Bootstrap时报错找不到jQuery的问题。通过在webpack配置文件中使用ProvidePlugin插件来全局提供jQuery实例，确保Bootstrap正常运行。完成配置后需重新运行npm rundev并导入jQuery。

vue-cli 在引入bootstrap时总是报找不到jquery。（模板用的webpack）

在webpack.base.conf.js里加入

var webpack = require("webpack")

在module.exports的最后加入

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

然后一定要重新npm  run dev

在main.js 引入就ok了import $ from 'jquery'

转载于:https://www.cnblogs.com/chenguangliang/p/6934053.html

vue中不通过./build/webpack.base.conf.js 配置使用jquery
yth_m_123的博客
05-20 4989
在使用vue-cli搭建的项目中，是无法直接在组件中使用jquery的。如果想使用，要先进行一些配置。 网上许多文章都是介绍如何在./build/webpack.bace.conf.js文件中配置使用jquery，但是有些人的项目目录中没有./build，这应该只是脚手架搭建的目录结构不同。 这时候应该找node_modules/@vue/cli-service/webpack.config.js这个文件，进行配置。 1.安装jquery $ cnpm install jquery -S 或者 $ npm
webpack.base.conf.js文件
倾世~茹薇
04-27 5864
文件开头的path模块提供了用于处理文件和目录路径的使用工具。utils是vue开发环境的wepack相关配置文件，主要用来处理css-loader和vue-style-loader。引入config目录下的index.js配置文件，主要用来定义一些开发和生产环境的属性。vue-loader.conf配置文件是用来解决各种css文件的，定义了诸如css,less,sass之类的和样式有关的load...
vue cli3找不到webpack.base.conf.js，可以这样引入jquery
qq_45668489的博客
03-23 9032
如何在vue-cli 3.x中使用jquery 由于项目需求要使用jquery，结果各种引用都不济于事。 首先下载 jquery。 cnpm install jquery --save-dev 或者 添加依赖，在package.json中找到dependencies模块，然后往里面追加jQuery，以jq版本2.2.3为例： “dependencies”: { “vue”: “^2.3.3”, ...
vue-cli中引入Jquery，使用$get
lixinhui2323的博客
05-22 501
是找不到这个webpack.base.conf.js文件，这时，vue.config.js==webpack.base.conf.js。注：有的博客里是修改webpack.base.conf.js这个文件，如果你当初使用的是vue-cli。可以在main.js中导入如下红框内容试试（但是不确定对不对），直接在vue.config.js里面修改就好了。这个肯定在vue3/vue-cli中肯定是不对的。自此完成jQuery的引入和配置。安装成功能看见版本信息如下。有的文章导入的是这个。
在vue-cli中使用jquery
darabiuz的博客
01-08 544
1.导入jquery 输入命令cnpm install jquery --save 查看package.json是否安装成功 2.修改vue.config.js 添加以下代码语句 const webpack = require("webpack"); module.exports = { configureWebpack: { plugins: [ new webpack.ProvidePlugin({ $: "j
在Vue-cli中引入jquery
菜鸟丹丹的博客
05-25 1589
产品说字体的颜色要动态取，但是css文件不存在变量一说，聪明的我立马想到了利用js给元素设置颜色，这个时候是要抓取元素的，说道抓取元素还是jquery最方便了，那么怎么在Vue-cli中引入jquery呢     需要在webpack中全局引入jquery  ， 打开package.json文件，在里面加入这行代码，jquery后面的是版本，根据你自己需求更改 dependencies:{...
vue-cli3 引入jquery
weixin_39975379的博客
02-26 8404
本篇博客转载于https://juejin.im/entry/5b446efde51d45194e0b8985，写在这里只是用于记录。 vue-cli3的所有的配置项都在vue.config.js的文件中进行配置，so步骤搞起来： 第一步：安装jquery 命令行工具，进入项目文件夹，执行：  npm install jquery --save 第二步:确定安装成功 提示安装成功后，在p...
vue-cli 中引入jQuery
coder丶东的博客
07-24 455
一、npm 包安装 npm install jquery --save-dev 二、配置webpack.base.config.js webpack有providePlugin插件，可以自动引入模块。所以需要在项目工程的webpack.base.config.js中添加以下配置： const webpack = require('webpack') plugins: [ ...
Vue-CLI中引入jQuery并写一个轮播图
一只柠檬菜鸡
10-11 427
想在Vue-CLI项目中使用轮播图，轮播图的代码是根据自己需求作了修改的别人的代码，其中用到jQuery。 需求： 1.写出轮播图的代码 2.在Vue-CLI中引入jQuery 3.将轮播图的代码放入项目中封装为组件 1.将jq引入到vue-VLI中 A. 安装jQuery npm install jquery –save 安装成功后package.json显示：（应该是默认安装最新版本） B. 配置vue.config.js（框内新增） C. 在main.js中引入 import $ from 'j
vue-cli中引入jquery的方法
绿葡萄的博客
02-26 1118
第一步：安装jquery，我使用yarn， yarn add jquery 第二步：配置 webpack.base.conf.js 位于build文件夹下 在顶部加入代码 const webpack = require("webpack") 在 module.exports = {} 中加入plugins plugins: [ new webpack.optimiz...
vue-cli webpack 引入jquery的方法
10-18
小编使用的是webpack模板在vue-cli生成的工程中引入jquery的方法，首先在package.json里的dependencies加入"jquery" : "^2.2.3"，然后install，具体内容详情大家参考下本
vue-cli 引入jQuery，Bootstrap，popper的方法
10-18
但是，如果项目中有其他类型的文件需要引入jQuery或Bootstrap，可以在相应规则中添加对应的加载器。 配置完成后，webpack将能够在项目构建过程中识别和处理jQuery、Bootstrap和popper.js。需要注意的是，在模块中...
详解在vue-cli中引用jQuery、bootstrap以及使用sass、less编写css
10-19
在Vue CLI中引用jQuery、Bootstrap以及使用Sass和Less编写CSS是常见的前端开发需求，本文将详细介绍这些步骤。 首先，让我们来看看如何在Vue CLI项目中引入Bootstrap。Bootstrap是一款流行的前端框架，提供了丰富的...
《Linux运维总结：Redis7.4.5哨兵集群开启ACL并配置用户》
东城绝神
09-12 361
《Linux运维总结：Redis7.4.5哨兵集群开启ACL并配置用户》
前后端开发Mock作用说明，mock.ts
循环编织时间年轮，递归叩问存在本质，谁能在硅基荒原上，种出思想的玫瑰……
09-12 328
mock.ts是前端开发中用于模拟后端接口的TypeScript文件，通过生成虚假数据使前端无需等待后端即可独立开发。它定义数据结构、模拟请求响应，并提供与真实接口一致的调用方式。示例展示了如何生成用户数据并模拟分页接口，使用vite-plugin-mock等工具实现。前端代码调用Mock接口与调用真实接口方式相同，待后端完成时只需替换接口地址即可平滑切换，实现了前后端并行开发。
JavaScript的功能和作用
2402_83164836的博客
09-10 489
JavaScript（简称 JS）是一种​​，最初设计用于为网页添加动态交互功能。经过多年发展，其应用场景已远超浏览器，成为覆盖前端、后端、移动端、桌面端甚至物联网等领域的“全场景语言”。
＜uniapp＞＜指针组件＞基于uniapp，编写一个自定义箭头指针组件
用沸腾的热血，支付我们的人生吧！
09-10 404
本文介绍了基于uniapp开发的自定义带箭头指针组件，通过SVG实现直线和箭头的组合效果。组件支持设置长度、颜色、角度等参数，并提供三种箭头规格(small/normal/big)可选。文章详细讲解了SVG结构的实现过程，包括计算终点坐标、响应式参数处理等核心功能，并展示了不同配置下的指针效果。该组件可用于时钟指针等场景，具有灵活性和复用性特点。
JavaScript经典面试题二（函数和作用域）
最新发布
weixin_43746297的博客
09-12 957
摘要：本文系统介绍了JavaScript中12个核心函数概念，包括闭包、作用域、函数绑定方法、高阶函数、箭头函数、生成器函数、防抖节流、递归、纯函数、函数重载和偏函数。重点解析了闭包的定义、实现原理及4种应用场景；详细对比了call/apply/bind三者的区别；深入探讨了箭头函数与普通函数的4个关键差异；分析了防抖节流的实现逻辑和应用场景；总结了递归的优缺点和使用建议；阐释了纯函数的定义和优势；说明了如何在JavaScript中模拟函数重载；介绍了偏函数的概念和实现方式。这些内容全面覆盖了JavaScr
Linux Node.js 安装及环境配置详细教程
csdn_aspnet的专栏，请点击博客主页右上角三个点中的私信联系
09-11 894
本文介绍了Node.js及其包管理工具npm的基本概念，并提供了详细的Linux环境安装配置指南。Node.js是基于Chrome V8引擎的JavaScript运行环境，使JavaScript能够用于服务端开发。npm是Node.js的包管理工具，类似于Maven，可自动处理依赖关系。文章详细讲解了从官网下载Node.js安装包到Linux服务器的步骤，包括解压、创建软连接、环境变量配置等操作，最后通过node -v和npm -v命令验证安装是否成功。该教程适用于需要在CentOS7系统上部署Node
Vue-cli中详述jQuery、Bootstrap及Sass/Less CSS集成教程
二、引入jQuery 1. 安装jQuery：使用npm命令行工具安装jQuery依赖，使用`npm install jquery --save`。初始尝试可能会收到一个警告，提示弃用某些旧版本，这时需要将安装名称改为全小写`jquery`。 2. 修改Webpack...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值