为什么要引入jquery?

vue中一般不需要使用jquery,但当我们需要使用的某个插件没有vue的版本且又使用了jquery,那我们就需要引入jquery了

安装、配置与使用

  ①install,执行以下命令

npm install jquery --save     //如果使用了淘宝镜像可以使用cnpm

②配置,webpack.base.conf.js

//...原有代码

//添加的代码
var webpack = require('webpack') module.exports = {
//...原有代码
plugins: [
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery",
jquery: "jquery",
"window.jQuery": "jquery"
})
], //...原有代码
}

③使用

安装配置完成后我们就可以在需要使用的组件中使用了,在需要的位置引入即可

import $ from 'jquery'

如果需要全局设置可以放到app.vue中引入

import $ from 'jquery'
//
//let $ = require('jquery')
//window.$ = $

vue使用--Jquery引入的更多相关文章

  1. 脚手架搭建的vue项目里引入jquery和bootstrap

    引入jquery: 1.在cmd输入:npm install jquery,回车,等待.. 2.在webpack.base.conf.js里进行如下操作: 3.在webpack.prod.conf.j ...

  2. 在vue项目中引入jquery

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

  3. 每天一点点之vue框架开发 - 引入Jquery

    1. 安装jquery npm install jquery --save-dev 2.在build/webpack.base.conf.js中添加如下内容 var webpack = require ...

  4. vue单页面引入CDN链接

    不想在index.html文件中全局引入CDN资源,那么如何在Vue单文件组件中引入?下面来瞅瞅~ 虚拟DOM创建 Vue 通过创建一个虚拟 DOM 来追踪自己要改变的真实 DOM 什么是虚拟DOM? ...

  5. MintUI引入vue项目以及引入iconfont图标

    官网地址:http://mint-ui.github.io/#!/zh-cn 中文文档:http://mint-ui.github.io/docs/#/zh-cn2 示例展示:http://eleme ...

  6. vue 和 jquery混合使用

    有时候只要想到要用的 vue.js 的时候就会惯性的想起用vue-cli手脚架搭建一个项目,但是有时候的业务场景并不适合用vue-cli手脚架,这个时候使用vue+jquery混合使用,把他们的优点结 ...

  7. 前端学习笔记系列一:10整体移动vscode代码块、VSCode 使用 stylus,配置格式化设置、在vue项目中引入bootstrap

    1.整体移动vscode代码块 凭借操作的经验我们能够轻松地知道将代码整体往右移只需选中代码按Tab键即可.其实往左移也很简单: 选中之后按下 shift+Tab键 即可. 2.VSCode 使用 s ...

  8. vue中import引入模块路径中@符号是什么意思

    在编写vue文件中引入模块 import model from "@/common/model"; 这里路径前面的“@”符号表示什么意思? resolve: { // 自动补全的扩 ...

  9. 想在已创建的Vue工程里引入vux组件

    <1>. 在项目里安装vux npm install vux --save <2>. 安装vux-loader (这个vux文档似乎没介绍,当初没安装结果报了一堆错误) npm ...

随机推荐

  1. Codeforces Round #599 (Div. 1) B. 0-1 MST 图论

    D. 0-1 MST Ujan has a lot of useless stuff in his drawers, a considerable part of which are his math ...

  2. Codeforces Round 596 题解

    万幸的是终于碰上了一场上分好场. 不幸的是一开始差点不会 A. 万幸的是想了个不那么稳的结论过了 pretest. 不幸的是罚时很高,而且慌得一比. 万幸的是然后半个小时内把 B 和 C 码了. 不幸 ...

  3. ubuntu命令查看英伟达显卡型号

    在终端输入如下命令:nvidia-smi

  4. git查看/修改个人信息-用户名邮箱

    我们在使用git作为仓库管理工具时,要设置自己Git的用户名和邮箱,要不然大家一块开发时不知道谁是谁,不知道谁提交的. 另外,当我们用自己的电脑开发时你可能设置的是一个你喜欢的昵称,所以那就得改一下. ...

  5. C#数组1

    using System; namespace ConsoleApp3 { class Program { static void Main(string[] args) { , , , , , }; ...

  6. 【随笔】CLR:向头对象(Object Header)迈进一大步!!!

    前言 在我之前一篇随笔里(戳我),我们知道,一个引用类型的对象,包含了2个额外的开销,一个是头对象(object header),一个是MT.我们接下来看看头对象到底有多神秘... Object He ...

  7. Web前端基础(2):HTML(二)

    1. body中的相关标签 1.1 标题标签:hn HTML提供<hn>系列标签,用于修饰标签,包含:<h1>.<h2>.<h3>.<h4> ...

  8. Spring Boot的注解,你知道或者不知道的都在这里!

    1.1 定义 Annotation(注解),用于为Java代码提供元数据.简单理解注解可以看做是一个个标签,用来标记代码.是一种应用于类.方法.参数.变量.构造器及包的一种特殊修饰符. 1.2 注解的 ...

  9. 深入浅出js实现继承的7种方式

    给大家介绍7中js继承的方法 有些人认为JavaScript并不是真正的面向对象语言,在经典的面向对象语言中,您可能倾向于定义类对象,然后您可以简单地定义哪些类继承哪些类(参考C++ inherita ...

  10. Macbook触控板使用技巧

    1. 在Storyboard鼠标右键可以直接拖线的,如果你用的是外接的第三方鼠标,没必要按着 control 键再用鼠标左键拖线 如果是触控板的话,双指按下去就可以直接拖线,带3Dtouch功能的触控 ...