vue如何引入jquery(vue+webpack4.0+iview2.14+vuex+es6+stylus架构二)

14 篇文章 0 订阅
2 篇文章 0 订阅

为什么要引入jquery?

    很多人vue的插件库没有jquery完善,比如导出word、excel等功能

    很多人依赖jquery开发,转成vue一时之间无法完全适应,但是建议少在vue中引入jquery,需要插件可以去github或者vue社区找。

第一步:安装jquery依赖

cnpm i jquery@latest --save

解释:

    @latest表示安装最新的包

    --save表示安装为production环境依赖

第二步:引入jquery到项目

src/main.js
import $ from 'jquery'
window.$=$

解释:

    为什么要window.$=$ ?因为不加这句在控制台$.fn===undefined; 无法在控制台使用jquery的方法

第三步:webpack配置jquery

build/webpack.base.conf.js

const webpack = require('webpack')

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

解释:

    在头部导入webpack; 在module.exports中加入jquery的配置即可

    然后就可以在代码的任意位置用$愉快的使用jquery的所有方法了

(ps:有问题随时可以留言问我)

上一篇:搭建vue框架(vue+webpack4.0+iview2.14+vuex+es6+stylus架构一)

下一篇:vue如何引入echart(vue+webpack4.0+iview2.14+vuex+es6+stylus架构三)

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值