在使用create-react-app 创建的项目中使用 bootstrap; 安装react-bootstrap;

npm install react-bootstrap --save
npm install bootstrap@3 -D

2018-12-20

然后在index.js中引入

import './bootstrap/dist/css/bootstrap.css';

import 'bootstrap/dist/css/bootstrap-theme.css';

在需要使用bootstrap 的组件中，引入所需要的组件；

import { Navbar, Nav, NavItem } from 'react-bootstrap'; // 导航组件

npm start 就可以使用了　！

在 React项目中使用 bootstrap的更多相关文章

  1. react 项目中 引入 bootstrap

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

  2. 如何在非 React 项目中使用 Redux

    本文作者:胡子大哈 原文链接:https://scriptoj.com/topic/178/如何在非-react-项目中使用-redux 转载请注明出处,保留原文链接和作者信息. 目录 1.前言 2. ...

  3. 如何优雅地在React项目中使用Redux

    前言 或许你当前的项目还没有到应用Redux的程度,但提前了解一下也没有坏处,本文不会安利大家使用Redux 概念 首先我们会用到哪些框架和工具呢? React UI框架 Redux 状态管理工具,与 ...

  4. react项目中实现元素的拖动和缩放实例

    在react项目中实现此功能可借助 react-rnd 库,文档地址:https://github.com/bokuweb/react-rnd#Screenshot .下面是实例运用: import ...

  5. React项目中实现右键自定义菜单

    最近在react项目中需要实现一个,右键自定义菜单功能.找了找发现纯react项目里没有什么工具可以实现这样的功能,所以在网上搜了搜相关资料.下面我会附上完整的组件代码. (注:以下代码非本人原创,具 ...

  6. React项目中使用Mobx状态管理（二）

    并上一节使用的是普通的数据状态管理,不过官方推荐使用装饰器模式,而在默认的react项目中是不支持装饰器的,需要手动启用. 官方参考 一.添加配置 官方提供了四种方法, 方法一.使用TypeScrip ...

  7. vue-cli+webpack在生成的项目中使用bootstrap方法（二）

    vue-cli+webpack在生成的项目中使用bootstrap方法(一)中,是通过手动下载bootstrap库,然后手动添加到src/assets中,显然是过程太多. 当然是可以更省力些,可以通过 ...

  8. 在react项目中使用ECharts

    这里我们要在自己搭建的react项目中使用ECharts,我们可以在ECharts官网上看到有一种方式是在 webpack 中使用 ECharts,我们需要的就是这种方法. 我们在使用ECharts之 ...

  9. 优雅的在React项目中使用Redux

    概念 首先我们会用到哪些框架和工具呢? React UI框架 Redux 状态管理工具,与React没有任何关系,其他UI框架也可以使用Redux react-redux React插件,作用:方便在 ...

随机推荐

  1. 线程池实例：使用Executors和ThreadPoolExecutor

    线程池负责管理工作线程,包含一个等待执行的任务队列.线程池的任务队列是一个Runnable集合,工作线程负责从任务队列中取出并执行Runnable对象. java.util.concurrent.ex ...

  2. Linux - Unix环境高级编程(第三版) 代码编译

    Unix环境高级编程(第三版) 代码编译 本文地址:http://blog.csdn.net/caroline_wendy 时间:2014.10.2 1. 下载代码:http://www.apuebo ...

  3. 创建一个zookeeper的会话（实现watcher）

    在先前的章节中,我们利用zkCli去了解了一下主要的zookeeper的操作.在接下来的章节中,我们将会学习一下在应用中是怎样利用zookeeper的api的.接下来我们将利用一个程序展示一下,怎样来 ...

  4. <十二>读<<大话设计模式>>之状态模式

    对于状态模式,<<大话设计模式>>是以人从上班到下班到加班的状态来展开讲述的.状态模式事实上就是某一个对象在某个过程或者时间的一个状态记录,可是这个状态的顺序不能发生变化.在程 ...

  5. HDU 6044 Limited Permutation 读入挂+组合数学

    Limited Permutation Problem Description As to a permutation p1,p2,⋯,pn from 1 to n, it is uncomplica ...

  6. Spring中的事务管理（学习笔记）

    什么是事物? 事物是指逻辑上的一组操作,这组操作要么全部成功,要么全部失败. 事物的特性: 原子性.一致性.隔离性.持久性 Spring事务管理的高级接口: PlatformTransactionMa ...

  7. 阿里Java编程规范 学习笔记

    @import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/c ...

  8. acd - 1427 - Nice Sequence（线段树）

    题意:一个由n个数组成的序列(序列元素的范围是[0, n]).求最长前缀 j .使得在这个前缀 j 中对于随意的数 i1 < i2.都满足随意的 m <= j.i1 在前 m 个数里出现的 ...

  9. BusyBox下ftpget的使用方法

    在终端输入ftpget命令,可以得到以下帮助信息: BusyBox v1.17.4 (2010-12-22 10:59:18 CST) multi-call binary. Usage: ftpget ...

  10. I2S总线协议理解

    I2S总线 Inter IC Sound总线又称集成电路内置音频总线. I2S对数字音频设备之间的音频数据传输而制定的一种总线标准. 采用了沿独立的导线传输时钟与数据信号的设计,通过将数据和时钟信号分 ...