vue-element-admin引入jQuery

需求

vue-element-admin框架里有些组件需要引用jquery。和常规的vue不同，这个用的是新的vue-cli框架，所有没有webpack.conf文件。

解决方法

1.在vue.config.js里开头加上 const webpack = require('webpack')。

2.在vue.config.js中找到configureWebpack，添加数据项

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

即

  configureWebpack: {
    // provide the app's title in webpack's name field, so that
    // it can be accessed in index.html to inject the correct title.
    name: name,
    resolve: {
      alias: {
        '@': resolve('src')
      }
    },
    //添加插件
    plugins: [
      new webpack.ProvidePlugin({
        jQuery: 'jquery',
        $: 'jquery'
      })
    ]

  },

3.最后在需要的组件中引入或者全局注册即可

组件中引入

import $ from 'jquery'

全局注册

在入口文件main.js中

import JQuery from 'jquery'
Vue.use(JQuery)