在vue项目里使用jquery
1.NPM 安装 jQuery,项目根目录下运行以下代码
npm install jquery --save
2.webpack配置
在项目根目录下的build目录下找到webpack.base.conf.js文件,在开头使用以下代码引入webpack,因为该文件默认没有引用,
var webpack = require('webpack')
然后在module.exports中添加一段代码,
// 原有代码 resolve: { extensions: ['.js', '.vue', '.json'], alias: { 'vue$': 'vue/dist/vue.esm.js', '@': resolve('src') } }, // 添加代码 plugins: [ new webpack.ProvidePlugin({ $: "jquery", jQuery: "jquery", jquery: "jquery", "window.jQuery": "jquery" }) ], // 原有代码 module: { rules: [ // ...... ] }
main.js里导入jQuery
import 'jquery'
最后启动项目 npm run dev即可
在vue项目里使用jquery的更多相关文章
- 脚手架搭建的vue项目里引入jquery和bootstrap
引入jquery: 1.在cmd输入:npm install jquery,回车,等待.. 2.在webpack.base.conf.js里进行如下操作: 3.在webpack.prod.conf.j ...
- 如何在 vue 项目里正确地引用 jquery 和 jquery-ui的插件
copy内容的网址: https://segmentfault.com/a/1190000007020623 使用vue-cli构建的vue项目,webpack的配置文件是分散在很多地方的,而我们需要 ...
- 如何在 vue 项目里正确地引用 jquery
转载 2016年11月13日 使用vue-cli构建的vue项目,webpack的配置文件是分散在很多地方的,而我们需要修改的是build/webpack.base.conf.js,修改两处的代码 / ...
- 项目里的jquery.min.js错误
项目里的jquery.min.js报一系列 - Missing semicolon - Missing semicolon - Missing semicolon - Missing semicolo ...
- 在vue项目中引入jquery
在vue项目中引入jquerycnpm install jquery --save在main.js中引入,加入下面这行代码:import 'jquery'注:有些项目是按需加载的,在main.js里面 ...
- vue 项目里正确地引用 jquery
一.NPM安装的jQuery 使用vue-cli构建的vue项目,需要修改的是build/webpack.base.conf.js 1.添加引入webpack,后面的plugins那里需要 const ...
- 如何在Vue项目中引入jQuery?
假设你的项目由vue-cli初始化 (e.g. vue init webpack my-project). 在你的vue项目目录下执行: npm install jquery --save-dev 打 ...
- Vue项目中使用jquery插件
1.引入jquery,并且在vue.config.js里配置 config.plugin('provide') .use(webpack.ProvidePlugin, [{ $: 'jquery', ...
- vue项目如何引用jquery
虽然vue不推荐直接操作DOM,而且也提供了操作DOM的方式.但是在某些时候还是要用到jquery,那么如何引入jquery呢? 费了半天劲,记录一下: 一 : 安装jquery npm instal ...
随机推荐
- PL/SQL学习笔记之集合
一:PL/SQL集合 集合是一个有序且存有相同的类型数据的数据结构. PL/SQL提供了三种集合类型: 索引表(关联数组) 嵌套表 数组 二:索引表:一个索引表(也叫关联数组)是一组键 - 值对.每个 ...
- 【转】VS2015详细安装步骤
亲身经历记录下来,以备后用.也希望能够帮助到有需要的朋友们! 1.安装之前首先下载VS2015,下载地址: [VS2015社区版官方中文版下载]:http://download.microsoft.c ...
- Lucene与Solr基础
SolrSelectTest 查询与删除 package com.snow.solr; import com.snow.bean.Product; import org.apache.solr.cli ...
- 【微信小程序项目实践总结】30分钟从陌生到熟悉 web app 、native app、hybrid app比较 30分钟ES6从陌生到熟悉 【原创】浅谈内存泄露 HTML5 五子棋 - JS/Canvas 游戏 meta 详解,html5 meta 标签日常设置 C#中回滚TransactionScope的使用方法和原理
[微信小程序项目实践总结]30分钟从陌生到熟悉 前言 我们之前对小程序做了基本学习: 1. 微信小程序开发07-列表页面怎么做 2. 微信小程序开发06-一个业务页面的完成 3. 微信小程序开发05- ...
- 搭建web之 服务器鉴权失败,请确认服务器已启用密码鉴权并且账号密码正确?
实例化时,登录过程中出现 服务器鉴权失败! 这是由于密码错误所致! 第一种情况:原始随机密码 第一种情况,你没有修改密码,则可以直接查找原始密码: 过程详见官网 使用密码登录的前提条件 密码: 若用户 ...
- (6) MySQL慢查询日志的使用
一. 设置方法 使用慢查询日志里捕获 启用之前需要先进行一些设置 方法一:全局变量设置 设置慢查询日志的日志文件位置 set global slow_query_log_file = "D: ...
- Codeforces Round #313 (Div. 2) C. Gerald's Hexagon(补大三角形)
C. Gerald's Hexagon time limit per test 2 seconds memory limit per test 256 megabytes input standard ...
- DTO转DOMAIN动态转换类。
package dtotransfer.util; import dtotransfer.annotation.DomainField; import java.lang.annotation.Ann ...
- Linux下printf、fprintf、sprintf的区别
(1)fprintf() int fprintf( FILE *stream, const char *format, ... ); 用于文件操作,根据指定的format(格式)发送信息(参数)到 ...
- 【转】Cowboy 开源 WebSocket 网络库
原文链接: http://www.cnblogs.com/gaochundong/p/cowboy_websockets.html