vue-cli中引入jquery的方法
vue-cli中引入jquery的方法
以前写vue项目都没有引入过jquery,今天群里面的一位小伙伴问了我这个问题,我就自己捣鼓了一下,方法如下:
我们先进入webpack.base.conf.js文件,开始顶部是这样的,我们需要加一行代码

变成这样
var path = require('path')
var utils = require('./utils')
var webpack = require("webpack") //这是我们添加的
var config = require('../config')
var vueLoaderConfig = require('./vue-loader.conf')
然后到下面的module.exports内部加入
plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
jQuery: "jquery",
$: "jquery"
})
],
我们在上面引入webpack就是为了在此使用webpack对象;
然后在package.json里的dependencies加入"jquery" : "^1.8.0";或者你可以使用npm install xxx -save去生成
然后我们就可以在main.js里面去导入jquery了

最后,重启项目
最最后,骚年,去浪吧
vue-cli中引入jquery的方法的更多相关文章
- 在vue项目中引入jquery
在vue项目中引入jquerycnpm install jquery --save在main.js中引入,加入下面这行代码:import 'jquery'注:有些项目是按需加载的,在main.js里面 ...
- vue-cli3.0以上项目中引入jquery的方法
这里配置的是vue-cli3.0引入jquery的方法,不是vue-cli2.0的配置方法 一.安装jquery npm install jquery --save 二.在vue.config.js ...
- Vue组件中引入jQuery
一.安装jQuery依赖 在使用jQuery之前,我们首先要通过以下命令来安装jQuery依赖: npm install jquery --save # 如果你更换了淘宝镜像,可以使用cnpm来安装, ...
- 如何在Vue项目中引入jQuery?
假设你的项目由vue-cli初始化 (e.g. vue init webpack my-project). 在你的vue项目目录下执行: npm install jquery --save-dev 打 ...
- vue系列---vue项目(已安装vuex)中引入jquery
vue项目中引入jquery有很多方法,这只是其中一种. 步骤如下: 1,安装jquery依赖 npm install jquery --save 如果是使用淘宝镜像则将npm改为cnpm 2,修改配 ...
- vue/cli 3 引入 使用jQuery
注意这里配置的是vue-cli3.0引入jquery的方法,不是vue-cli2.0的配置方法 一.安装jquery npm install jquery --save 二.一般安装成功后在packa ...
- 前端学习笔记系列一:10整体移动vscode代码块、VSCode 使用 stylus,配置格式化设置、在vue项目中引入bootstrap
1.整体移动vscode代码块 凭借操作的经验我们能够轻松地知道将代码整体往右移只需选中代码按Tab键即可.其实往左移也很简单: 选中之后按下 shift+Tab键 即可. 2.VSCode 使用 s ...
- 每天一点点之vue框架开发 - 引入Jquery
1. 安装jquery npm install jquery --save-dev 2.在build/webpack.base.conf.js中添加如下内容 var webpack = require ...
- vue-cli3搭建的vue项目中使用jquery
装包:npm install jquery --save 方式一 全局使用 1)main.js中引入 // jquery import $ from 'jquery' Vue.prototype.$ ...
随机推荐
- HDU 1042 N!(高精度乘)
Problem Description Given an integer N(0 ≤ N ≤ 10000), your task is to calculate N! Input One N in ...
- 在线求助man page
一.举例——输入“man date” 图1 图2 图3 二.man之概述 用于:命令的使用说明 用法:man 命令 man page:执行“man 命令”后,出现的屏幕界面 补:man是manual( ...
- Daily Scrum 10
今天我们小组开会内容分为以下部分: part 1: 经过反复思考,对于上次组会确定的在系统中加入娱乐版块进行了更进一步的商讨; part 2:继续探讨算法实现: part 3:进行明日的任务分配; ◆ ...
- Calculator Part Ⅰ
GitHub/object-oriented The title of the work 关于这次的作业,一开始我是觉得不难的,毕竟学长在已经提供了足够多的提示,实现步骤.需要那些方面的知识等等.但是 ...
- Java常用类之StringBuffer
StringBuffer 类: 1. java.lang.StringBuffer 代表可变的字符序列: 2. StringBuffer 和 String 类似,但是 StringBuffer 可以对 ...
- 关于char, wchar_t, TCHAR, _T(),L,宏 _T、TEXT,_TEXT、L
char :单字节变量类型,最多表示256个字符, wchar_t :宽字节变量类型,用于表示Unicode字符, 它实际定义在<string.h>里:typedef unsigned s ...
- 学习 SQL 语句 - Select(9): 其他
//只要前五条记录 procedure TForm1.Button1Click(Sender: TObject); begin with ADODataSet1 do begin Clos ...
- 【SQLAlchemy】SQLAlchemy技术文档(中文版)(上)
1.版本检查 import sqlalchemy sqlalchemy.__version__ 2.连接 from sqlalchemy import create_engine engine = c ...
- java获取时间整点工具代码
/**获取上n个小时整点小时时间 * @param date * @return */ public static String getLastHourTime(Date date,int n){ C ...
- BZOJ 1786 配对(DP)
如果我们直接令dp[i][j]为前i个位置第i个位置填j所产生的逆序对的最少数.这样是不满足无后效性的. 但是如果发现对于两个-1,如果前面的-1填的数要大于后面的-1填的数.容易证明把他们两交换结果 ...