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. springMVC怎么改变form的提交方式为put或者delete

    想着练习一下创建restful风格的网站呢,结果发现在jsp页面上并不能灵活使用put和delete提交方式.下面我的解决办法 一. form 只支持post和get两种提交方式,只支持get提交方式 ...

  2. Machine Learning分类:监督/无监督学习

    从宏观方面,机器学习可以从不同角度来分类 是否在人类的干预/监督下训练.(supervised,unsupervised,semisupervised 以及 Reinforcement Learnin ...

  3. [C++] Class (part 2)

    Members that are const or reference must be initialized. Similary, members that are of a class type ...

  4. codeforces 228E The Road to Berland is Paved With Good Intentions(2-SAT)

    Berland has n cities, some of them are connected by bidirectional roads. For each road we know wheth ...

  5. 微信小程序:封装全局的promise异步调用方法

    微信小程序:封装全局的promise异步调用方法 一:封装 function POST(url, params) { let promise = new Promise(function (resol ...

  6. Spring学习(二)—— java的动态代理机制

    在学习Spring的时候,我们知道Spring主要有两大思想,一个是IoC,另一个就是AOP,对于IoC,依赖注入就不用多说了,而对于Spring的核心AOP来说,我们不但要知道怎么通过AOP来满足的 ...

  7. IPython 4.0发布:Jupyter和IPython分离后的首个版本

    IPython 4.0日前正式发布,这是IPython分离成IPython和Jupyter后的第一个重要版本. 更新Jupyter的快捷方式是: pip install --upgrade jupyt ...

  8. 【Python】Python简易爬虫爬取百度贴吧图片

    通过python 来实现这样一个简单的爬虫功能,把我们想要的图片爬取到本地.(Python版本为3.6.0) 一.获取整个页面数据 def getHtml(url): page=urllib.requ ...

  9. set(gcf,'DoubleBuffer','on')以及sort

    设置的目的是为了防止在不断循环画动画的时候会产生闪烁的现象,而这样便不会了.在动画的制作比较常用. Matlab排序函数-sort sort函数的调用格式: sort(X) 功能:返回对向量X中的元素 ...

  10. filter过滤器 默认情况下只对客户端发来的请求有过滤作用 对服务端的跳转不起作用 需要显示的在xml定义过滤的方式才行

    filter过滤器 默认情况下只对客户端发来的请求有过滤作用 对服务端的跳转不起作用 需要显示的在xml定义过滤的方式才行