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的方法的更多相关文章

  1. 在vue项目中引入jquery

    在vue项目中引入jquerycnpm install jquery --save在main.js中引入,加入下面这行代码:import 'jquery'注:有些项目是按需加载的,在main.js里面 ...

  2. vue-cli3.0以上项目中引入jquery的方法

    这里配置的是vue-cli3.0引入jquery的方法,不是vue-cli2.0的配置方法 一.安装jquery npm install jquery --save 二.在vue.config.js ...

  3. Vue组件中引入jQuery

    一.安装jQuery依赖 在使用jQuery之前,我们首先要通过以下命令来安装jQuery依赖: npm install jquery --save # 如果你更换了淘宝镜像,可以使用cnpm来安装, ...

  4. 如何在Vue项目中引入jQuery?

    假设你的项目由vue-cli初始化 (e.g. vue init webpack my-project). 在你的vue项目目录下执行: npm install jquery --save-dev 打 ...

  5. vue系列---vue项目(已安装vuex)中引入jquery

    vue项目中引入jquery有很多方法,这只是其中一种. 步骤如下: 1,安装jquery依赖 npm install jquery --save 如果是使用淘宝镜像则将npm改为cnpm 2,修改配 ...

  6. vue/cli 3 引入 使用jQuery

    注意这里配置的是vue-cli3.0引入jquery的方法,不是vue-cli2.0的配置方法 一.安装jquery npm install jquery --save 二.一般安装成功后在packa ...

  7. 前端学习笔记系列一:10整体移动vscode代码块、VSCode 使用 stylus,配置格式化设置、在vue项目中引入bootstrap

    1.整体移动vscode代码块 凭借操作的经验我们能够轻松地知道将代码整体往右移只需选中代码按Tab键即可.其实往左移也很简单: 选中之后按下 shift+Tab键 即可. 2.VSCode 使用 s ...

  8. 每天一点点之vue框架开发 - 引入Jquery

    1. 安装jquery npm install jquery --save-dev 2.在build/webpack.base.conf.js中添加如下内容 var webpack = require ...

  9. vue-cli3搭建的vue项目中使用jquery

    装包:npm install jquery --save 方式一 全局使用 1)main.js中引入 // jquery import $ from 'jquery' Vue.prototype.$ ...

随机推荐

  1. MATLAB画图符号标注

    线型 说明 标记符 说明 颜色 说明 - 实线(默认) + 加号符 r 红色 -- 双划线 o 空心圆 g 绿色 : 虚线 * 星号 b 蓝色 :. 点划线 . 实心圆 c 青绿色 x 叉号符 m 洋 ...

  2. 【转载】2015Android 面试题 01

    1.如何避免ANR? 答:ANR:Application Not Responding,五秒在Android中,活动管理器和窗口管理器这两个系统服务负责监视应用程序的响应. 当出现下列情况时,Andr ...

  3. selenium实现文件上传方法汇总(AutoIt、win32GUI、sengkeys)---基于python

    在使用selenium进行UI自动化测试时,经常会遇到一个关于本地文件上传的问题,解决此问题一般分两种情况: 1. 元素标签为input 2.非input型上传 下面我们分别对着两种情况进行实例分析 ...

  4. dataTables工作总结

    近期在工作中用到了dataTables,现在总结一下在工作中遇到的问题以及解决方法,如有不妥之处希望多多指教,定会改进. 首先这里用的是coloradmin框架,在vs环境下开发. 这里写一个容器用于 ...

  5. lintcode-161-旋转图像

    161-旋转图像 给定一个N×N的二维矩阵表示图像,90度顺时针旋转图像. 样例 给出一个矩形[[1,2],[3,4]],90度顺时针旋转后,返回[[3,1],[4,2]] 挑战 能否在原地完成? 标 ...

  6. JDK源码分析 – LinkedList

    LinkedList类的申明 public class LinkedList<E> extends AbstractSequentialList<E> implements L ...

  7. lol人物模型提取(三)

      提取出来的lol人物模型能让你知道一些有趣的信息,比如说给英雄量个身高啥的.   经测量,佐伊的身高应大于1m60,比想象中的着实高不少啊.   然后还应该把这个模型镜像对称一下,在3dsmax里 ...

  8. 20个实用的Linux命令

    20个实用的Linux命令 2016-04-16 程序员之家 1. 命令:sl (蒸汽机车) 你可能了解 ‘ls’ 命令,并经常使用它来查看文件夹的内容.但是,有些时候你可能会拼写成 ‘sl’ ,这时 ...

  9. Java内存分配及垃圾回收机制

    Java内存区域 1.内存区域 jvm运行时数据区域 程序计数器 Java虚拟机栈 本地方法栈 方法区 Java堆 大图 2.概念解释 程序计数器   线程私有的一块很小的内存空间,它是当前线程所执行 ...

  10. mysql(二) 慢查询分析(一)

    如下表结构: CREATE TABLE `trade_order` ( `order_id` ) unsigned NOT NULL AUTO_INCREMENT COMMENT '订单编号', `t ...