这里配置的是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. fiddler之模拟请求超时和弱网模式

    在针对手机端测试时,很多情况下我们需要测试响应超时和弱网情况的响应情况.此时可以使用fiddler提供的断点和弱网功能进行测试. 1.请求超时 设置断点,是请求响应超时.查看请求结果. Rules-- ...

  2. Apache监控调优

    apache是一款对静态资源处理得比较好的中间件,但是对动态请求处理得不是很好,tomcat则正好相反. apache运用得比较多得工作模式主要是Prefork和Worker两种模式 1.Prefor ...

  3. c# 排列组合代码类

    /// <summary> /// 排列组件算法类 /// </summary> /// <typeparam name="T"></ty ...

  4. 打印一个浮点数组，会输出字符串"Hello, world“ & 浮点数的二进制表示(IEEE 754标准)

    #include <stdio.h> #include<stdlib.h> int main() { float a[3] = { 1143139122437582505939 ...

  5. 【Linux开发】【Qt开发】ARM QT移植详细步骤教程

    ARM QT移植详细步骤教程 米尔SAM9X5和A5D3X上默认的Qt版本是4.5.3,当这个版本的Qt库不能满足实际开发需求时,可通过此方法制定Qt开发.运行环境. 移植的步骤如下: 1.下载新版q ...

  6. kafka学习(五)

    kafka可靠的数据传递   kafka可靠性保证 ACID 是关系型数据库保证数据的规范,指的是原子性,一致性,隔离性和持久性,这是数据库给出的可靠性保证.   kafka给出的保证是什么? 1.k ...

  7. 第九周总结&第七次实验报告

    实验7 实验任务详情: 完成火车站售票程序的模拟. 要求: (1)总票数1000张: (2)10个窗口同时开始卖票: (3)卖票过程延时1秒钟: (4)不能出现一票多卖或卖出负数号票的情况. 实验过程 ...

  8. Oracle 查看一个数据库实例下面所有的表大小

    1. 因为 oracle有一些 lob字段 在user_extents 里面取出来的结果不是表名, 所以需要与user_lobs 表做关联查询才可以 本来想通过 关联查询来实现, 发现字表查询更简单 ...

  9. 打印 PRINT

    打印 PRINT 字符串和数值类型 可以直接输出. print(1) #out:1 print('a') #out:a 变量 无论什么类型,数值,字符串,列表,字典...都可以直接输出 n = 1 s ...

  10. MapReduce计算模型二

    之前写过关于Hadoop方面的MapReduce框架的文章MapReduce框架Hadoop应用(一) 介绍了MapReduce的模型和Hadoop下的MapReduce框架,此文章将进一步介绍map ...