这里配置的是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. Flex String拼接

    平时Flex String拼接的时候直接str+str2 今天就想看看Flex自带的函数好不好用,然后使用 str.concat(str2); Alert.show(str); 结果没有变化,才发现一 ...

  2. oracle data guard --理论知识回顾02

    继上一篇 管理影响物理standby的事件 1 创建表空间或数据文件初始化参数standby_file_management用来控制是否自动将primary数据库增加表空间或数据文件的改动,传播到st ...

  3. ES6标准入门 第四章:字符串的扩展

    1.字符串的Unicode 表示法 JavaScript 允许采用 \uxxxx 表示一个字符,其中 xxxx 表示字符的码点. "\u0061" // "a" ...

  4. FLUME安装&环境(一):netcat类型配置

    1.下载软件 在 /opt/deploy 下新建 flume 文件夹: # mkdir / opt/deploy / flume 到Flume官网上http://flume.apache.org/do ...

  5. 【ABAP系列】SAP ABAP控制单元格是否可编辑

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[ABAP系列]SAP ABAP控制单元格是否可 ...

  6. Java基础/Socket.io双向通信

    Socket.io基础知识(一) (一).socket.io提供了基于事件的实时双向通讯 Web端与服务端实时数据传输方式: 1.Ajax轮询方式(最早应用)   原理:设置定时器,定时通过Ajax同 ...

  7. python multiprocessing模块 介绍

    一 multiprocessing模块介绍 python中的多线程无法利用多核优势,如果想要充分地使用多核CPU的资源(os.cpu\_count\(\)查看),在python中大部分情况需要使用多进 ...

  8. 【LGR-063】洛谷11月月赛 I & MtOI2019 Ex Div.2 (A-C)

    [MtOI2019]黑蚊子多 : 按题意模拟 #include<iostream> #include<cstdio> #include<cstring> using ...

  9. htpwdScan — 一个简单的HTTP暴力破解、撞库攻击脚本

    李姐姐之前跟我们分享了子域名枚举工具subDomainBrute<subDomainsBrute — 改进渗透测试时暴力枚举子域名的python脚本>,这回带给我们htpwdScan ht ...

  10. 2019 红帽杯 Re WP

    0x01 xx 测试文件:https://www.lanzous.com/i7dyqhc 1.准备 获取信息 64位文件 2.IDA打开 使用Findcrypt脚本可以看到 结合文件名是xx,因此猜测 ...