vue.js怎么引入bootstrap

vue.js引入bootstrap的方法：首先使用【npm install bootstrap --save-dev】指令进行安装；然后在【main.js】中使用【import 'bootstrap相关文件路径'】语法引入即可。

本教程操作环境：windows7系统、Vue2.9.6&&bootstrap3版，Dell G3电脑。

【相关文章推荐：vue.js】

vue.js引入bootstrap的方法：

1、使用指令:

npm install bootstrap --save-dev

2、安装成功后，能够在package.json文件夹中看到bootstrap这个模块。这时候需要在main.js中添加如下内容:

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

至此bootStrap也引入结束，接下来我们的重点来了，因为BootStrap与VUE有一个专门的设计叫做bootstrap-vue.js，所以我们引入它之后就可以直接使用它们提供的专有样式，比原生的bootStrap要好看很多

3、使用指令:

npm i vue bootstrap-vue bootstrap

4、在main.js文件中添加:

import Vue from 'vue'
import BootstrapVue from 'bootstrap-vue'
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'
Vue.use(BootstrapVue)

相关免费学习推荐：javascript（视频）

以上就是vue.js怎么引入bootstrap的详细内容，更多请关注www.sxiaw.com其它相关文章！