在vue中引入jq

用vue-cli脚手架工具构建项目成功后 当需要引入JQ,可用以下方法:

1.首先在package.json里的

dependencies加入"jquery" : "^3.2.1",

2.在终端里输入

npm install jquery --save-dev 

3.找到build文件夹下的webpack.base.conf.js文件,打开,添加:

var webpack=require('webpack')

在module.exports里输入:

        plugins: [
new webpack.ProvidePlugin({
$:"jquery",
jQuery:"jquery",
"windows.jQuery":"jquery"
})
],

4.在入口文件main.js中输入:

import $ from 'jquery'

5.在终端输入

npm run dev

6.验证方法 在APP.vue里进行验证   看图:

希望可以帮到你!

vue引入JQ的方法的更多相关文章

  1. VUE引入jq bootstrap 之终极解决方案(测试)

    初入VUE遇见的一些问题,在网上找了些方法,再根据自己的实际项目解决的问题写得此文,,希望对你有所帮助. vue-cli快速构建项目以及引入boostrap.jq各种插件配置 vue-cli脚手架工具 ...

  2. vue里面引入jq的方法

    1:因为已经安装了vue脚手架,所以需要在webpack中全局引入jquery 打开package.json文件,在里面加入这行代码,jquery后面的是版本,根据你自己需求更改. dependenc ...

  3. vue引入jquery的方法

    1.局部引入 通过命令下载jquery   npm install jquery --save-dev 在需要引入jquery的组件中通过import $ from 'jquery'引入即可 2.全局 ...

  4. webpack构建Vue项目引入jQ时发生“'$' is defined but never used”的处理

    今天公司需要新建个数据后台,就按照查到的方法构建了Vue框架的项目,引入jQ.bootstrap时,按照在线方法配置,发现 main.js 里的引用jQ一直显示红标,没多想,在按照网上配置完后,npm ...

  5. vue的常用组件方法应用

    项目技术: webpack + vue + element + axois (vue-resource) + less-loader+ ... vue的操作的方法案例: 1.数组数据还未获取到,做出预 ...

  6. [转]vue跨域解决方法

      vue跨域解决方法 vue项目中,前端与后台进行数据请求或者提交的时候,如果后台没有设置跨域,前端本地调试代码的时候就会报“No 'Access-Control-Allow-Origin' hea ...

  7. Vue引入第三方JavaScript库和如何创建自己的Vue插件

    一 第三方JavaScript库 前言 .vue文件 中不解析 script标签引入js文件,只能用 import 引入 有两种用法: 1.import a from '../a' 2.import ...

  8. vue 与jq 的对比

    vue.react和angular,众所周知,他们是前端框架的3个大佬.这篇主要想对比一下用vue和用jq的区别,至于和其他框架的对比,我想vue的官网说的更为详细. 我算是独自用vue写过一个小型项 ...

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

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

随机推荐

  1. python多进程并发和多线程并发和协程

    为什么需要并发编程? 如果程序中包含I/O操作,程序会有很高的延迟,CPU会处于等待状态,这样会浪费系统资源,浪费时间 1.Python的并发编程分为多进程并发和多线程并发 多进程并发:运行多个独立的 ...

  2. Openshift 错误解决 "修改docker cgroup driver"

    一.Openshift 错误解决 "修改docker cgroup driver" 一.错误如下 failed to run Kubelet: failed to create k ...

  3. DHCP和TFTP服务

    DHCP服务 主要用途:用于内部网络和网络服务供应商自动分配IP地址给用户 用于内部网络管理员作为对所有电脑作集中管理的手段 使用场景:自动化安装系统 解决IPV4资源不足问题 DHCP共有八种报文: ...

  4. Python3.0科学计算学习之绘图(四)

    绘制三维图: mplot3d工具包提供了点.线.等值线.曲面和所有其他基本组件以及三维旋转缩放的三维绘图. 1.散点的三维数据图 from mpl_toolkits.mplot3d import ax ...

  5. web自动化测试python+selenium学习总结----python环境安装

    一.python下载地址:https://www.python.org/downloads/ 二.双击python的.exe文件安装: 后面直接点击“next” 步骤二:选择安装在D:\python3 ...

  6. okhttp3工具类及其使用

    先工具类 package com.bhy.bdai.util; import com.alibaba.fastjson.JSON; import com.alibaba.fastjson.JSONAr ...

  7. Sitecore 8.2 页面架构设计:模板与组件

    介绍 Sitecore的开放式架构和众多API意味着在Sitecore中实施网站可能会在很多方向上发生偏差.架构的一个特别重要的方面涉及页面构建 - 如何构建Sitecore中的网页? Sitecor ...

  8. get_class __class__ get_called_class 分析记录

    首先看代码: class A { use T { T::say as aTsay; } public function say() { echo 'a__class__:' . __CLASS__ . ...

  9. 1064 - You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near 'groups)VALUES('1','hh','hh@163.com','Boss')' at line 1

    mysql8.0版本 在已存在的表里插入一条数据 insert INTO api_user(id,username,email,groups)VALUES('1','hh','hh@163.com', ...

  10. Oarcle之单行函数(下)

    1.字符函数 ltrim 去除字符串左边指定字符,如果不设定第二个参数,则默认去除空格 rtrim去除字符串右边指定字符,如果不设定第二个参数,则默认去除空格 例如:select ltrim (‘a  ...