jquery在vue脚手架中的使用方式示例
本文介绍了jquery在vue脚手架中的使用方式示例,分享给大家,具体如下:
1:在各个vue文件中使用
这种方式不会影响原来VUE文件中的$的使用,完全可行;但是需要每个vue文件都引入一遍;
2:在入口文件app.vue中整体引入,不会报错
3:在main.js中整体引入,
4:在index.html中整体引入
以上3中方法经过亲测,不会报错,但是VUE文件中的JS也不会执行,不可行;
下面的方法经过亲测,完全可行;
通过npm安装依赖引入
1:通过npm安装依赖引入
npminstalljquery-S
2:修改webpack配置文件
build/webpack.base.conf.js
... varwebpack=require("webpack")//1.确保引入webpack,后面会用到 module.exports={ ... resolve:{ extensions:['.js','.vue','.json'], modules:[ .. ], alias:{ ... //2.定义别名和插件位置 'jquery':'jquery' } }, plugins:[ //3.配置全局使用jquery newwebpack.ProvidePlugin({ $:"jquery", jQuery:"jquery", jquery:"jquery", "window.jQuery":"jquery" }) ] }
手动载入
手动下载jQuery放在static目录下,如:static/js/jquery.min.js
alias:{ ... //2.定义别名和插件位置 "jquery":path.resolve(__dirname,'../static/js/jquery.min.js') }, plugins:[ //3.配置全局使用jquery newwebpack.ProvidePlugin({ $:"jquery", jQuery:"jquery", jquery:"jquery", "window.jQuery":"jquery" }) ]
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持毛票票。
声明:本文内容来源于网络,版权归原作者所有,内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎发送邮件至:czq8825#qq.com(发邮件时,请将#更换为@)进行举报,并提供相关证据,一经查实,本站将立刻删除涉嫌侵权内容。