这里配置的是vue-cli3.0引入jquery的方法,不是vue-cli2.0的配置方法

一、安装jquery

npm install jquery --save

二、在vue.config.js 文件中配置

在文件的头部位置加上const webpack = require('webpack'),然后在module.exports中,添加

plugins: [

new webpack.ProvidePlugin({

$:"jquery",

jQuery:"jquery",

"windows.jQuery":"jquery"

})

]

注意:这里的vue.config.js文件并不是创建完项目就有的,而是自己新建,因为vue cli3以上的脚手架隐藏了各种配置文件,你要想自己手动配置一些东西就需要新建一个vue.config.js

三、在main.js文件中引入

在main.js中添加“import $ from 'jquery”,添加这行Vue.prototype.$ = $,就表示给vue原型上添加 $,在组件中调用的时候通过this.$方式,this指向为VueCompornent

vue-cli3.0以上项目中引入jquery的方法的更多相关文章

  1. 在vue项目中引入jquery

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

  2. vue-cli中引入jquery的方法

    vue-cli中引入jquery的方法 以前写vue项目都没有引入过jquery,今天群里面的一位小伙伴问了我这个问题,我就自己捣鼓了一下,方法如下: 我们先进入webpack.base.conf.j ...

  3. vue cli3以上的项目中如何使用axois请求本地json文件

    首先明确一点,在vue cli3以上的版本中,存放静态资源的文件是public 我刚开始以为是和vue cli2一样需要放在static文件夹下,但是项目中没有这个文件夹,我就自己创建了一个,结果请求 ...

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

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

  5. web项目中引入jquery easyui

    jQuery easyui是一个基于jquery的用户界面插件集合,可以做出各种炫酷页面效果,大中型项目都可以使用些框架,非常好用,而且它有中文网,提供了大量的demo.下面我们看怎么将它引入到项目中 ...

  6. vue-cli3项目中引入jquery 以及如何引进bootstrap

    1.安装jquery npm install jquery --save 2.或则在package.json中指定版本号,然后运行npm install命令 "dependencies&qu ...

  7. vue cli3.0 封装组件全局引入js文件并发布到npm

    首先用 vue create创建一个项目 当前的项目目录是这样的: 首先需要创建一个 packages 目录,用来存放组件 然后将 src 目录改为 examples 用作示例 二.修改配置 启动项目 ...

  8. Angular项目中引入jQuery

    npm install --save jquery npm install @types/jquery --save 在对应的组件中引入 import * as $ from "jquery ...

  9. 使用VUE CLI3.0搭建项目vue2+scss+element简易版

    1.安装Vue CLI 3 //三选一即可cnpm install -g @vue/cli npm install -g @vue/cli yarn global add @vue/cli 注意: 1 ...

随机推荐

  1. 阶段3 1.Mybatis_02.Mybatis入门案例_3.mybatis注解开发和编写dao实现类的方式

    注解的用法 直接创建一个新的项目 下一步直接next 然后finish即可 把之前项目01里面的代码直接复制过来 复制到我们02的注解的工程中 把01项目导入的依赖也都粘贴过来 再把测试类复制过去 复 ...

  2. Jmeter---后置处理器 BeanShell PostProcessor 获取JDBC结果(多行)并以列表传入另一个请求

    之前用python+locust对脚本生成商品编码, 商品上架,购买商品进行编写脚本和压测: 开始是打算用Jmeter,后来遇到问题在 Jmeter如何读取JDBC多行并组成列表,作为下一个请求 一直 ...

  3. springboot(3) 页面到服务器

    第一讲实现了spring boot 环境的下载及配置. 第二讲实现了,从服务器,到页面. 第三讲打算从页面到服务器. 比如,我们希望 从页面,点击一个按钮,传递信息到服务器. 就拿传递用户名和密码来简 ...

  4. C++笔记(7)——一些模拟题:简单模拟、查找元素、图形输出、日期处理、进制转换、字符串处理

    以下内容基本来自<算法笔记>,作者为胡凡,建议直接买书看,我这里只是摘抄部分当笔记,不完整的. 简单模拟 就是一类"题目怎么说你就怎么做"的题目.这类题目不涉及算法,只 ...

  5. Ubuntu 16.04 设置静态IP 注意事项

    目录 查看动态ip下的网络信息 查看默认网关 设置静态网络 查看动态ip下的网络信息 1 ifconifg # 查看网卡信息: 可以看出网口名称为 eno1, 以及子网掩码(mask) 查看默认网关 ...

  6. 【Qt开发】几个傻不拉几关于char*和const char*的不兼容问题

    1. string转const char* string s ="abc";constchar* c_s = s.c_str(); 2. const char*转string   ...

  7. 【Linux开发】arm-linux-gnueabihf-gcc下载

    原文地址:http://www.veryarm.com/arm-linux-gnueabihf-gcc veryarm是个不错的网站,里面介绍了很多相关的基础知识. arm-linux-gnueabi ...

  8. linux rz上传-sz下载

    yum install lrzsz -y rz     上传文件    不能传目录 如果要传目录需要打包成文件再上传 需要往哪里传东西,先进入哪个目录 rz -y   上传覆盖 sz -y 文件名  ...

  9. switch条件变量的取值类型

    switch条件变量的取值类型主要有以下六种: 1)JDK1.5(不含JDK1.5)之前只能是byte.short.int.char类型,不能是float.double.long.boolean类型. ...

  10. 分享一个linux系统中循环遍历两个数组内容,并输出数组中的不同内容的shell脚本

    cat diffarray.sh #!/bin/bash arry_list1=(1 2 3 4 5 6 7 8 9) arry_list2=(3 5 8) declare -a diff_list ...