在vue中使用JQuery

在vue中使用JQuery

在vue中可能会使用到JQuery，那么就要安装他并引入调用，但是在Vue2.0和Vue3.0中的使用的方式有所不同。

最开始都要先下载jquery包

yarn add jquery
或者
npm i jquery

• 在Vue2.0中使用JQuery

下载好后，就只需要在main.js中引入，就可以全局使用了

import $ from 'jquery'
//虽然引入的jquery呈灰色状态但是是可以使用的

• 在vue3.0中使用Jquery
  如果像vue2.0中相同的方式的话，那么就会报错 显示$ is not defined

方法：

1.1：打开.eslintrc.js 文件，找到env ，在里面 添加 jquery:true，默认应该是只有node:true，如果都没有，那就加上env

1.2：如果没有eslintrc.js 文件可以在package.json中配置

2：打开vue.config.js 文件（没有这个文件可以手动创建一个）
在文件的头部位置加上const webpack = require(‘webpack’)，然后在module.exports中，添加

configureWebpack: {

   plugins: [

      new webpack.ProvidePlugin({

        $:"jquery",

        jQuery:"jquery",

        "windows.jQuery":"jquery"

      })

    ]

}

3.最后还是要在main.js中import $ from 'jquery’
完成后就可以全局使用jquery了