vue学习三 vue项目中正确添加jquery
2018-03-01 12:59
781 查看
1.用了vue项目之后确实在处理html界面中的数据特别方便也适用,但是随之功能点的需求更新,发现vue项目也有实现不了的功能
2.在界面中需要用到jquery的fullpage插件,此时还是需要在vue项目中导入jquery
3.此时的导入jquery不像原来的script引入了,而是需要命令行安装以及配置数据
此时若为cnpm则修改为cnpm
4.安装好jquery后,需要修改配置文件数据
a.打开package.json文件,在里面加入这行代码,jquery后面的是版本,根据你自己需求更改。
b.在webpack.dev.conf.js中module.exports的最后加入这行代码,
c.在main.js中引入,加入下面这行代码
5.最后一步,重新跑一边就好,npm run dev
2.在界面中需要用到jquery的fullpage插件,此时还是需要在vue项目中导入jquery
3.此时的导入jquery不像原来的script引入了,而是需要命令行安装以及配置数据
此时若为cnpm则修改为cnpm
npm install jQuery
4.安装好jquery后,需要修改配置文件数据
a.打开package.json文件,在里面加入这行代码,jquery后面的是版本,根据你自己需求更改。
dependencies:{ //此处的jquery版本根据npm后的版本来看,会有安装版本的提示 "jquery":"^3.3.1" }
b.在webpack.dev.conf.js中module.exports的最后加入这行代码,
plugins: [ new webpack.optimize.CommonsChunkPlugin('common.js'), new webpack.ProvidePlugin({ jQuery: "jquery", $: "jquery" })
c.在main.js中引入,加入下面这行代码
import 'jquery'
5.最后一步,重新跑一边就好,npm run dev
相关文章推荐
- vue学习四 vue项目中正确添加swiper组件
- vue项目学习13--jquery
- vue项目添加Jquery
- 在进行vue的学习,项目中需要引入bootstrap、jquery的步骤。
- 在vue项目中正确的引入jquery
- 打通前后端全栈开发node+vue进阶【课程学习系统项目实战详细讲解】(3):用户添加/修改/删除 vue表格组件 vue分页组件
- Android Framework学习笔记 -- 在android源码添加项目的正确办法
- 如何在Vue项目中正确的引入JQuery
- 在vue项目中正确的引入jquery
- Android Studio创建Xposed模块项目时BridgeApi的正确添加方式
- MVC学习添加jQuery动画
- 脚手架搭建的vue项目里引入jquery和bootstrap
- vue学习(一)项目搭建
- vue学习2 vue 项目目录介绍
- vue.js学习之用命令行将项目push到github上
- 在Vue项目里正确地引用jQuery插件(axios同理)
- 在vue项目中使用jquery
- 如何在vue-cli+webpack构建的项目引入jquery和bootstrap
- vue 项目如何使用 jQuery
- vue+jQuery+bootstrap+sass项目搭建