VueCLI引入jQuery之后的使用

我太难了。。。

  • 一、安装jquery
    npm install jquery --save

  • 二、一般安装成功后在package.json文件内的dependencies项中会有"jquery": "^1.12.4",如果没有可以手动添加。需要注意的是,现在我们都是直接使用模板创建项目的,所以第一步是可以省略的(不要说我第二步才说第一步可以省略,这是你自己的问题,看任何东西都是先看了再去做的)。

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

  • 四、打开vue.config.js 文件,在文件的头部位置加上const webpack = require('webpack'),然后在module.exports中,添加
    configureWebpack: { plugins: [ new webpack.ProvidePlugin({ $:"jquery", jQuery:"jquery", "windows.jQuery":"jquery" }) ] }

  • 五、在main.js中添加“import $ from 'jquery”,到此步,jquery的配置就完成了

在使用的时候,一定要注意 $(function(){.....}) 在这里面写jquery代码,谨慎放在vue实例里面

在这个地方做个转载,怕忘了(点击跳转)

原文地址:https://www.cnblogs.com/Sinhtml/p/15303417.html