在使用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. Missing 'name' key attribute on element activity at AndroidMan

    <uses-permission android:content="android.permission.CHANGE_WIFI_STATE" /> 这是android ...

  2. Python源代码--整数对象(PyIntObject)的内存池

    [背景] 原文链接:http://blog.csdn.net/ordeder/article/details/25343633 Python整数对象是不可变对象,什么意思呢?比如运行例如以下pytho ...

  3. nginx 配置nginx.conf,负载均衡,逻辑分流

    nginx 最重要的配置文件nginx.conf: 一般的配置我不做解释,网上到处都是,主要对主要的几点进行注释(如下) worker_processes ; error_log /data/logs ...

  4. BIOS维修技术

    BIOS是电脑中最基础且最重要的程序,为电脑提供最低级且最直接的硬件控制,电脑的原始操作都是依照固化在BIOS里的程序来完成的.因此如果BIOS出现故障将会导致影响电脑的正常工作.BIOS故障有很多, ...

  5. 1987年国际C语言混乱代码大赛获奖的一行代码

    macb() ? lpcbyu(&gbcq/_\021%ocq\012\0_=w(gbcq)/_dak._=}_ugb_[0q60)s+ 这是CoolShell博主之前做了一个非常有意思的在线 ...

  6. 【直播预告】7月25日3D游戏引擎免费公开课答疑第三期,有奖问答!

    喜讯喜讯! 为了酬谢广大学员.CSDN学院特推出iOS和3D游戏引擎开发免费技术答疑公开课.让您度过一个充实的暑假~ 參与本次公开课,进行有奖问答.即有机会获奖. 答疑公开课时间:7月25日 晚7:3 ...

  7. POJ 2886 Who Gets the Most Candies?(树状数组+二分)

    题目链接 注意题目中给的顺序是顺时针的,所以在数组中应该是倒着存的.左就是顺时针,右就是逆时针.各种调试之后,终于A了,很多种情况考虑情况. #include <cstring> #inc ...

  8. app直播原理

    之前写的一系列文章或者小经验一直没有时间去整理放在博客上,今天整理出来,之前是写在作业部落,语法是markdown,点击链接浏览,仅供参考,希望对你有帮助. https://www.zybuluo.c ...

  9. STM32唯一身份识别ID(器件电子签名)的读取以及芯片Flash大小读取

    每个STM32有一个独立的ID,这个ID可以用来: 产品唯一的身份标识的作用:    ●  用来作为序列号(例如USB字符序列号或者其他的终端应用):    ●  用来作为密码,在编写闪存时,将此唯一 ...

  10. redis08----集群

    集群的作用: .主从备份,防止主机宕机 .读写分离,主服务器写,从服务器内容跟着主服务器,主服务器变他就变,读就从从服务器读.减轻主服务器的负担. .任务分离,比如消耗cpu和内存的操作,交给从服务器 ...