vue中如何引入jQuery和Bootstrap


Posted in jQuery onApril 10, 2017

这两天学习了Vue.js ,所以,今天添加一点小笔记。

一、引入jQuery

在当前项目的目录下(就是package.json),运行命令 cnpm install jquery --save-dev  这样就将jquery安装到了这个项目中。

然后修改webpack.base.conf.js(在build文件下)两个地方:

1:加入

var webpack=require('webpack');

2 在module.exports的里面加入

plugins: [
 new webpack.optimize.CommonsChunkPlugin('common.js'),
 new webpack.ProvidePlugin({
   jQuery: "jquery",
   $: "jquery"
 })
]

最后在main.js中加入import $ form 'jquery',完成jquery的引入

二、引入 bootstrap.css文件:

修改webpack.base.conf.js

resolve: {
extensions: ['.js', '.vue', '.json'],

alias: {

'vue$': 'vue/dist/vue.esm.js',

'@': resolve('src'),

'bootstrap':resolve('src/assets/bootstrap'),

}
},

在main.js中import引入

import 'bootstrap/js/bootstrap.min.js'
import 'bootstrap/css/bootstrap.min.css'

三、引入bootstrap.min.js文件:

在main.js中import引入

import 'bootstrap/js/bootstrap.min.js'

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jquery dataTable 获取某行数据
May 05 jQuery
jquery Form轻松实现文件上传
May 24 jQuery
详解jquery选择器的原理
Aug 01 jQuery
jQuery 中msgTips 顶部弹窗效果实现代码
Aug 14 jQuery
jQuery选择器中的特殊符号处理方法
Sep 08 jQuery
jQuery实现的事件绑定功能基本示例
Oct 11 jQuery
jQuery中的$是什么意思及 $. 和 $().的区别
Apr 20 jQuery
jQuery中的类名选择器(.class)用法简单示例
May 14 jQuery
Angular5中调用第三方库及jQuery的添加的方法
Jun 07 jQuery
jQuery实现checkbox全选功能完整实例
Jul 12 jQuery
jQuery层叠选择器用法实例分析
Jun 28 jQuery
如何基于jQuery实现五角星评分
Sep 02 jQuery
jQuery插件FusionCharts绘制2D柱状图和折线图的组合图效果示例【附demo源码】
Apr 10 #jQuery
jQuery插件FusionCharts绘制2D环饼图效果示例【附demo源码】
Apr 10 #jQuery
jQuery EasyUI之验证框validatebox实例详解
Apr 10 #jQuery
Django1.7+JQuery+Ajax验证用户注册集成小例子
Apr 08 #jQuery
利用jQuery解析获取JSON数据
Apr 08 #jQuery
JavaScript使用链式方法封装jQuery中CSS()方法示例
Apr 07 #jQuery
jQuery中map函数的两种方式
Apr 07 #jQuery
You might like
Yii PHP Framework实用入门教程(详细介绍)
2013/06/18 PHP
php实现微信公众号无限群发
2015/10/11 PHP
利用Laravel事件系统如何实现登录日志的记录详解
2017/05/20 PHP
添加到收藏夹代码(兼容几乎所有的浏览器)
2007/01/09 Javascript
js文件中调用js的实现方法小结
2009/10/23 Javascript
用JavaScript获取DOM元素位置和尺寸大小的方法
2013/04/12 Javascript
下拉列表select 由左边框移动到右边示例
2013/12/04 Javascript
Javascript中call的两种用法实例
2013/12/13 Javascript
原生javascript获取元素样式
2014/12/31 Javascript
Javascript之面向对象--封装
2016/12/02 Javascript
js es6系列教程 - 新的类语法实战选项卡(详解)
2017/09/02 Javascript
Vue v2.5 调整和更新不完全问题
2017/10/24 Javascript
基于JS开发微信网页录音功能的实例代码
2019/04/30 Javascript
vue实现折线图 可按时间查询
2020/08/21 Javascript
[01:24:16]2018DOTA2亚洲邀请赛 4.6 全明星赛
2018/04/10 DOTA
[54:26]完美世界DOTA2联赛PWL S3 Forest vs Rebirth 第一场 12.10
2020/12/12 DOTA
python连接mysql并提交mysql事务示例
2014/03/05 Python
python通过pil将图片转换成黑白效果的方法
2015/03/16 Python
使用Python脚本将文字转换为图片的实例分享
2015/08/29 Python
Django rest framework工具包简单用法示例
2018/07/20 Python
python 已知三条边求三角形的角度案例
2020/04/12 Python
python按顺序重命名文件并分类转移到各个文件夹中的实现代码
2020/07/21 Python
Python Celery异步任务队列使用方法解析
2020/08/10 Python
Python使用grequests并发发送请求的示例
2020/11/05 Python
英国网上购买门:Direct Doors
2018/06/07 全球购物
阿玛尼美妆俄罗斯官网:Giorgio Armani Beauty RU
2020/07/19 全球购物
Linux如何压缩可执行文件
2014/03/27 面试题
Linux如何为某个操作添加别名
2015/02/05 面试题
婚礼新郎父母答谢词
2014/01/16 职场文书
升旗仪式演讲稿
2014/05/08 职场文书
中药学自荐信
2014/06/15 职场文书
教师三严三实心得体会
2014/10/11 职场文书
2015年师德表现自我评价
2015/03/05 职场文书
公诉意见书范文
2015/06/05 职场文书
关于python类SortedList详解
2021/09/04 Python
flex弹性布局详解
2022/03/20 HTML / CSS