（1）到bootstrap官网下载所需版本的bootstrap.zip文件。

（2）将bootstrap.min.css以及bootstrap.min.js解压到assets文件夹，另外还需要将fonts字体文件夹解压到src文件夹下面。

（3）在main.js文件中通过

　　

import './assets/bootstrap.min.css'

import './assets/bootstrap.min'

引入bootstrap，引入完成之后，就可以在组件中使用bootstrap了。

另外需要注意的是bootstrap依赖于jQuery，需要先安装引入jQuery。

在Vue-cli项目中引入Bootstrap的更多相关文章

  1. 前端学习笔记系列一：10整体移动vscode代码块、VSCode 使用 stylus，配置格式化设置、在vue项目中引入bootstrap

    1.整体移动vscode代码块 凭借操作的经验我们能够轻松地知道将代码整体往右移只需选中代码按Tab键即可.其实往左移也很简单: 选中之后按下 shift+Tab键 即可. 2.VSCode 使用 s ...

  2. vue项目中引入bootstrap

    (1)引入Jquery文件,需要在bootstrap.min.js 之前引入. 1.npm install jquery --save-dev 2. plugins: [ new webpack.Pr ...

  3. react 项目中 引入 bootstrap

    react-bootstrap是一个非常受欢迎的针对react封装过的bootstrap,它本身不包含css,所以也是需要使用bootstrap原生库. 在create-react-app建的项目目录 ...

  4. Vuex内容解析和vue cli项目中使用状态管理模式Vuex

    中文文档:vuex官方中文网站 一.vuex里面都有些什么内容? const store = new Vuex.Store({ state: { name: 'weish', age: }, gett ...

  5. vue.cli项目中src目录每个文件夹和文件的用法

    assets文件夹是放静态资源:components是放组件:router是定义路由相关的配置:view视图:app.vue是一个应用主组件:main.js是入口文件:

  6. vue cli 项目中设置背景图

    https://blog.csdn.net/MoLvSHan/article/details/78204972 不能直接写成相对路径,像下面这这种就会报错 backgroundImage: " ...

  7. vue-cli项目中引入第三方插件

    前言 最近有小伙伴问道如何在vue-cli项目中引入第三方插件或者库,例如如果想在项目中使用jQuery中的Ajax请求数据呢?或者我想使用Bootstrap框架呢?等等这些问题,本篇博客将带你学习如 ...

  8. 关于Vue.cli 脚手架环境中引入Bootstrap时,table表格样式缺失的解决办法

    Vue+bootstrap不能正常使用table的样式 环境:下载官网的本地bootstrap包,然后在vue 的index.html引入bootstrap的css和js环境 问题描述:1. vue里 ...

  9. Vue中引入bootstrap导致的CSS问题

    最近在进行vue.js+webpack进行模块化开发的时候,遇到一个奇怪的问题. 问题是这样的: 1. 在main.js文件中引入bootstrap的js和css. 2. 自己写了一个Header.v ...

随机推荐

  1. 存储器的保护（二）——《x86汇编语言：从实模式到保护模式》读书笔记19

    接着上一篇博文说. 5.代码段执行时的保护 每个代码段都有自己的段界限.同栈段一个道理,有效界限和G位相关. G=0:有效界限 = 描述符中的段界限 G=1:有效界限 = 描述符中的段界限值 * 0x ...

  2. WPF的ProgressBar进度条

    1. ProgressBar常用属性 1.1.  Minimum:进度条的最小值,一般为 0 1.2. Maximum:进度条的最大值,一般为100 或者是 某一个数, 如复制文件时,总文件数等 1. ...

  3. SpringMVC Controller层的单元测试

    Getting Ready 测试相关Maven dependency如下: <dependency> <groupId>org.springframework</grou ...

  4. Oracle 12c心得

    1.重新启动Listener后,远程客户端登录不了,只能全新启动Oralce服务才能正常,经分析,用Net Manager增加一个服务器的IP地址的监听. 执行 net start 监听服务名 再远程 ...

  5. web_03Java ee实现定时跳转，使用C3P0，DBUtils类重构数据库操作

    Web Web_02版本: 实现功能 1,定时跳转 2,C3P0连接池 3,DBUtils工具类     设计内容 1,setHeader方法 2, 3, *重点 1,定时跳转: 1,selver实现 ...

  6. jq访问网络接口实例

    最近需要在app生活频道上,需要添加一些类目,这就需要用到一些公用的开放接口,ajax其实调用并不复杂,但是结合jquery则显得更简洁一些,下面一起来看看jquery调用后台api. 代码如下: & ...

  7. Windows加密API的功能分类

    本地数据加密保护本地数据加密保护机制提供了简单的DAPI调用接口,密钥管理等等一概由系统来处理.DAPI的数据加密保护机制在用户登录会话范围或者本地计算范围,使用操作系统设计的方式加密保护数据和解密还 ...

  8. 前端标注软件-pxcook像素大厨使用心得

    我们在日常开发过程中,设计师给提供的UI图,经常需要标注尺寸,有时候设计师难免会遗漏标注,这样就会大大的增加我们的沟通成本,因此,使用一款好用的标注软件就尤为重要,我推荐这款标注软件---pxcook ...

  9. jquery点击导航栏选中更换样式

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  10. 配置zookeeper集群

    创建3台服务,不同ip,相同端口 1.先安装jdk1.8 解压: tar -zxvf jdk-8u11-linux-x64.tar.gz 重新命名文件夹名字: mv jdk1..0_11/ jdk8 ...