vue项目引入jquery库的方法

vue项目引入jquery库的方法
1首先在package.json里的dependencies加入jquery

  "dependencies": {
    "axios": "^0.19.2",
    "element-ui": "^2.13.1",
    "jquery": "^3.5.1",
    "ol": "^5.2.0",
    "vue": "^2.5.2",
    "vue-router": "^3.0.1",
    "vuex": "^3.2.0",
    "xlsx": "^0.16.0"
  },

2.在终端里输入npm install jquery

npm install jquery

3 在build/webpack.base.conf.js文件module.exports中添加plugins属性如下代码

const webpack = require('webpack')

module.exports = {
  resolve:{}
  plugins: [    　　
    　　new webpack.ProvidePlugin({
    　　　　$: "jquery",
    　　　　jQuery: "jquery"
    　　})
  ],
  module:{}

4在main.js中引入jquery import $ from ‘jquery’

import $ from 'jquery'

import Vue from 'vue'
import App from './App'
import router from './router'
import $ from 'jquery'

5在app.vue使用jquery获取vue图片logo

<div id="app">
<image src="logo.png"/>
</div>

export default {
   name : "App",
   mounted(){
        var src= $('#app>img').attr('src');
   }
}

6安装jquery报错处理方法
报错问题描述

npm ERR! Unexpected token < in JSON at position 127336

解决办法如下所示：

删除根目录下的package-lock.json一个或多个文件，
然后在npm install jquery依赖包名字，就会发现成功了。
不用担心package-lock.json,在你安装完依赖包后，它又会生成。

—the—end—