在Element+Vue中引入jQuery

首先需要执行一下

npm install jquery --save

执行完后，npm会自动在package.json中加上jquery

"dependencies": {
    "element-ui": "^2.4.8",
    "vue": "^2.5.17",
    "vue-router": "^3.0.1",
    "vuex": "^3.0.1"
  },
  "engines": {
    "node": ">=6"
  },
  "devDependencies": {
    "autoprefixer": "^6.6.0",
    "babel-core": "^6.24.1",
    "babel-loader": "^6.4.0",
    "babel-preset-vue-app": "^1.2.0",
    "css-loader": "^0.27.0",
    "file-loader": "^0.10.1",
    "html-webpack-plugin": "^2.24.1",
    "jquery": "^3.4.1", ####执行完上面的命令，自动加了这行
    "less": "^3.0.4",
    "less-loader": "^4.1.0",
    "postcss-loader": "^1.3.3",
    "rimraf": "^2.5.4",
    "style-loader": "^0.13.2",
    "url-loader": "^0.5.8",
    "vue-loader": "^13.3.0",
    "vue-template-compiler": "^2.5.17",
    "webpack": "^2.4.1",
    "webpack-dev-server": "^2.4.2"
  }

然后，在webpack.config.js的plugins中加一段引用jquery的代码

把

new webpack.ProvidePlugin({
      jQuery: "jquery",
      $: "jquery"
    }),

放进plugins，如下:

plugins: [
    new webpack.optimize.CommonsChunkPlugin({
      names: ['vendor', 'manifest']
    }),
    new webpack.ProvidePlugin({
      jQuery: "jquery",
      $: "jquery"
    }),
    new HtmlWebpackPlugin({
      template: 'src/index.html'
    })
  ],

在main.js中加上

import $ from 'jquery'

然后在页面上就可以直接使用 jQuery方法了..