首页 > Web开发 > 详细

vue引入jquery

时间:2019-12-15 15:20:06      阅读:125      评论:0      收藏:0      [点我收藏+]

 1. 安装jquery  

npm install jquery --save
2. 配置
 webpack.base.conf.js中增加 const webpack = require(‘webpack‘)
技术分享图片




webpack.base.conf.js 中增加

技术分享图片

 

 

 

plugins: [ 

    new webpack.optimize.CommonsChunkPlugin(‘common.js‘),

    new webpack.ProvidePlugin({

      jQuery: "jquery",

      $: "jquery" 

    }) 

  ]




在main.js中增加如下代码

import jquery from ‘jquery‘

Vue.prototype.$ = jquery


技术分享图片

 

 




import Vue from ‘vue‘

import App from ‘./App‘

import router from ‘./router‘

import ElementUI from ‘element-ui‘

import ‘element-ui/lib/theme-chalk/index.css‘

import echarts from ‘echarts‘

import jquery from ‘jquery‘

Vue.prototype.$echarts = echarts

Vue.prototype.$ = jquery

Vue.config.productionTip = false

Vue.use(ElementUI)

/* eslint-disable no-new */

new Vue({

  el: ‘#app‘,

  router,

  render: h => h(App)

})


在 .eslintrc.js 中增加 jquery: true

技术分享图片

 

 





jquery 使用

$.ajax({
        type: ‘GET‘,
        url: ‘/api/data‘,
        dataType: ‘json‘,
        success: function(data) {
          debugger;
          myChart.setOption({
            xAxis: {
              data: data.data.categories
            },
            series: [
              {
                name: ‘销量‘,
                data: data.data.data
              }
            ]
          });
        }
      });



技术分享图片

 

 



vue引入jquery

原文:https://www.cnblogs.com/hztyzq/p/12043968.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!