最近学习vue,习惯性的通过<script>标签引入jquery,写完后报错才想起来,这种方式在vue是不适用的。

1:因为已经安装了vue脚手架,所以需要在webpack中全局引入jquery

打开package.json文件,在里面加入这行代码,jquery后面的是版本,根据你自己需求更改。

dependencies:{

"jquery":"^2.2.3"

}

然后在命令行中cnpm install

大多人应该都是使用的淘宝镜像,所以使用cnpm,如果你不是 ,可以使用npm安装。

2:在webpack.base.conf.js中加入一行代码

var webpack=require("webpack")

3:在webpack.base.conf.js中module.exports的最后加入这行代码,

plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
    jQuery: "jquery",
    $: "jquery"
})
]

4:在main.js中引入,加入下面这行代码

import $ from 'jquery'

5:最后一步,重新跑一边就好,cnpm run dev

以上方法我自己试过了,确认可以正常使用,如果有不对的地方欢迎联系我进行改正。

在vue中如何引jquer的更多相关文章

  1. vue中遇到的坑!!!!!

    一 .vue安装的坑 报错时的常见问题 1.cnpm install 模块名 –save-dev(关于环境的,表现为npm run dev 启动不了)cnpm install 模块名 –save(关于 ...

  2. vue中html、js、vue文件之间的简单引用与关系

    有关vue文件记录:index.html在html中运用组件 <body> <app></app> <!-- 此处app的组件为入口js main.js中定义 ...

  3. js微信禁用右上角的分享按钮,和vue中微信页面禁用右上角的分享按钮的问题

    1.隐藏微信网页右上角的按钮 document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() { // 通过下面这个 ...

  4. vue中如何不通过路由直接获取url中的参数

    前言:为什么要不通过路由直接获取url中的参数? vue中使用路由的方式设置url参数,但是这种方式必须要在路径中附带参数,而且这个参数是需要在vue的路由中提前设置好的. 相对来说,在某些情况下直接 ...

  5. vue中的重要特性

    一.vue中的自定义组件 html的代码: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  6. Vue中comoputed中的数据绑定

    Vue中的数据实现响应式绑定是在初始化的时候利用definePrototype的定义set和get过滤器,在进行组件模板编译时实现water的监听搜集依赖项,当数据发生变化时在set中通过调用dep. ...

  7. vue中使用stompjs实现mqtt消息推送通知

    最近在研究vue+webAPI进行前后端分离,在一些如前端定时循环请求后台接口判断状态等应用场景用使用mqtt进行主动的消息推送能够很大程度的减小服务端接口的压力,提高系统的效率,而且可以利用mqtt ...

  8. Vue中应用CORS实现AJAX跨域,及它在 form data 和 request payload 的小坑处理

    基本概念部分(一):理解CORS 说道Vue的跨域AJAX,我想先梳理一遍CORS跨域,"跨域资源共享"(Cross-origin resource sharing),它是一个W3 ...

  9. vue中watched属性

    watched属性,vue中的观察属性,可用来监听一个值的变化 默认有两个参数,新值,旧值 data (){ return { currentCity: "深圳" } } watc ...

随机推荐

  1. [LeetCode] 132. 分割回文串 II

    题目链接 : https://leetcode-cn.com/problems/palindrome-partitioning-ii/ 题目描述: 给定一个字符串 s,将 s 分割成一些子串,使每个子 ...

  2. Redis---键的过期时间及数据淘汰策略

    5.键的过期时间   Redis可以为每个键设置过期时间,当键过期时,会自动删除该键.   对于散列表这种容器,只能为整个键设置过期时间(整个散列表),而不能为键里面的单个元素设置过期时间. 6.数据 ...

  3. Pose &&Get的区别

    从一个页面转向另一个页面的请求方式有两种,Post和Get. 如果从原理上来探究他们的区别,涉及到Http传输协议的细节,本文不加探究,只讨论一下表象. 1.Post传输数据时,不需要在URL中显示出 ...

  4. R语言模型选择之精度准则与最大值法问题

    在模型选择中我们一般用caret包train函数建立模型,并对模型进行评判 方法1: ) tr_control<-trainControl(method = ) # 创建随机森林模型 model ...

  5. tf模型可视化工具

    一方面可以用tensorboard来可视化,更方便的是用如下网址: https://lutzroeder.github.io/netron/

  6. solaris硬盘格式化分区

    创建EFI分区及挂载文件系统的过程: # format AVAILABLE DISK SELECTIONS: 0. c1t0d0 <LSI-MR9261-8i-2.12-557.86GB> ...

  7. Pytorch详解NLLLoss和CrossEntropyLoss

    是什么? https://www.cnblogs.com/marsggbo/p/10401215.html 具体pytorch怎么运算的 https://blog.csdn.net/qq_222102 ...

  8. CommandLineRunner接口

    一.首先创建一个MyCommandLineRunner类实现CommandLineRunner接口     @Commponent把pojo注册到spring容器中 @Order(2)这个数越小优先级 ...

  9. IO流,字节流复制文件,字符流+缓冲复制文件

    JAVAIO如果按流向分:输入流和输出流两种 输入流的基类:InputStream   Reader 输出流的基类:OutputStream   Writer 如果按数据单元划分:字节流和字符流 字节 ...

  10. 对SQL 优化,提升性能!

    对SQL 进行优化能够有效提高SQL 语句的执行效率,降低系统资源开销,是开发者提高后端系统处理能力的首选方案. 新产品上线后,随着运营推广活动的开始,业务进入快速增长期,数据库作为后端系统唯一或者主 ...