vue中引入bootstrap简单粗暴的办法

我们网站项目完成有一段时间了,准备重新搞个bootstrap响应式,但是之前是vue写的,所以赶紧学习了一下怎么把bootStrap搞到vue项目中去,网上好多教程,但是我测试了,最好用的还是在bootStrap和jq官网直接下载文件然后放到static中,也可以使用远程文件,但是没网的时候就用不了了,还是把文件下载下来吧,开始吧!!看我现在的项目结构
vue中引入bootstrap简单粗暴的办法_第1张图片
我下载了boot和jq 然后将jquery.js文件放到了下载的boot文件的js中,然后放在static中
像图中这样 然后直接到index.html中去引用
在head中加入两行meta,主要是为了防止手机端的时候出现无效的情况






vue中引入bootstrap简单粗暴的办法_第2张图片
现在index.html的样子

然后我们可以测试有没有成功了
在组件中拷贝一段boot中的响应式导航栏的代码


看看效果 缩小屏幕前
在这里插入图片描述

之后
vue中引入bootstrap简单粗暴的办法_第3张图片

vue中引入bootstrap简单粗暴的办法_第4张图片

好了 出现效果就是成功了 是不是很简单粗暴!!有什么问题可以给我留言
vue中引入bootstrap简单粗暴的办法_第5张图片

你可能感兴趣的:(vue)