1.在react的index.html文件中加个jQuery的引入

<script src="http://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>

2.安装react-bootstrap

　　npm install react-bootstrap --save

安装bootstrap

　　npm install bootstrap@3.3.7 --save

3.在使用时，直接在入口文件导入

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

　　improt 'bootstrap/dist/js/bootstrap'

4.引入需要的组件

　　import {Navbar} from 'react-bootstrap'

脚手架搭建的react中使用bootstrap的更多相关文章

  1. 在React中使用Bootstrap

    这几天想在react中用一下bootstrap,尽管有一个适配react的很好的库叫react-bootstrap,但我还是想直接使用bootstrap 可以在react项目中执行以下命令安装boot ...

  2. create-react-app搭建的项目中添加bootstrap

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

  3. react脚手架搭建命令 react常用库

    react项目一般需要的组件库     react-redux     状态管理库     react-router-dom    路由     sass /less     style-compon ...

  4. 让vue-cli脚手架搭建的项目可以处理vue文件中postcss语法

    图中&属于postcss的语法,这样书写样式可以清楚的看出选择器之前的层级关系,非常好用. 在利用vue-cli脚手架搭建的项目中如果不配置是不支持这种写法的,这样写不会报错,但是样式不生效. ...

  5. 【webpack系列】从零搭建 webpack4+react 脚手架（一）

    搭建一个React工程的方式有很多,官方也有自己的脚手架,如果你和我一样,喜欢刨根究底,从零开始自己一行一行代码创建一个React脚手架项目,那你就来对地方了.本教程是针对React新手,以及对web ...

  6. react脚手架搭建1

    23:01:17 react脚手架搭建 (个人用的是webstorm,所以分享下webstorm中的创建react脚手架项目的方法) 1.创建新项目(前提是下载nodejs环境) 2.下载好在webs ...

  7. react+redux+generation-modation脚手架搭建一个todolist

    TodoList 1. 编写actions.js 2. 分析state 试着拆分成多个reducer 3. 了解store 4. 了解redux数据流生命周期 5. 分析容器组件和展示组件 搞清楚,数 ...

  8. 【每天学一点-04】使用脚手架搭建 React+TypeScript+umi.js+Antd 项目

    一.使用脚手架搭建项目框架 1.首先使用脚手架搭建React项目(React+TypeScript+Umi.js) 在控制台输入命令:yarn create @umijs/umi-app 2.引入An ...

  9. 在 React项目中使用 bootstrap

    在使用create-react-app 创建的项目中使用 bootstrap; 安装react-bootstrap; npm install react-bootstrap --savenpm ins ...

随机推荐

  1. BZOJ4710: [Jsoi2011]分特产 组合数学 容斥原理

    题意:把M堆特产分给N个同学,要求每个同学至少分到一种特产,共有多少种分法? 把A个球分给B个人的分法种数:(插板法,假设A个球互不相同,依次插入,然后除以全排列去重) C(A,B+A) 把M堆特产分 ...

  2. OrCAD Capture CIS绘制原理图、Allegro PCB Design XL 绘制PCB

    1.OrCAD Capture CIS绘制原理图 1.1.快捷键 (1)放置连线         w (2)放置net名称      n     放下一个时再按n可以编辑名字 (3)编辑属性      ...

  3. SQL语句中count(1)count(*)count(字段)用法的区别（转）

    SQL语句中count(1)count(*)count(字段)用法的区别 在SQL语句中count函数是最常用的函数之一,count函数是用来统计表中记录数的一个函数, 一. count(1)和cou ...

  4. DataGridView 调整列顺序为设计的顺序

    设置: dataGridView1.AutoGenerateColumns = false;

  5. c++踩坑大法好 typedef和模板

    1,typedef字面意思,自定义一种数据类型 语法:typedef 类型名称 类型标识符; 基本用法: 1) 为基本数据类型定义新的类型名. 2) 为自定义数据类型(结构体.公用体和枚举类型)定义简 ...

  6. orm 相关

    优化

  7. TC基础与自动化

    前言 互联网产品的测试常常要覆盖在不同网络下的表现,例如丢包,带宽受限,时延及抖动等网络较差的情况,为了测试场景的网络情况可定义及复现,就需要有个工具对弱网进行模拟.业界一些通用的弱网模拟工具,如NE ...

  8. Execl导出

    1.ExeclUtil.java public class ExcelUtil { public static <T> HSSFWorkbook exprotExcel(String ti ...

  9. [SDOI2012]任务安排 - 斜率优化dp

    虽然以前学过斜率优化dp但是忘得和没学过一样了.就当是重新学了. 题意很简单(反人类),利用费用提前的思想,考虑这一次决策对当前以及对未来的贡献,设 \(f_i\) 为做完前 \(i\) 个任务的贡献 ...

  10. [CF1236D] Alice and the Doll - 模拟,STL

    [CF1236D] Alice and the Doll Description \(N \times M\)网格,有 \(K\) 个格子里有障碍物.每次经过一个格子的时候只能直走或者右转一次.初态在 ...