create-react-app搭建的项目中添加bootstrap
react-bootstrap是一个非常受欢迎的针对react封装过的bootstrap,它本身不包含css,所以也是需要使用bootstrap原生库。
在create-react-app建的项目目录中安装react-bootstrap。
npm install react-bootstrap --save
安装bootstrap。
npm install bootstrap@3.3.7 --save
在index.js文件中增加css引用。
import 'bootstrap/dist/css/bootstrap.css'; import 'bootstrap/dist/css/bootstrap-theme.css';
import 'bootstrap/dist/js/bootstrap.js';
在需要用到bootstrap组件的代码中,引入所需组件。
import { Navbar, Jumbotron, Button } from 'react-bootstrap';
如果需要下拉组件,需要引入1.9.1以上的jquery,npm里没有找到1.9.1以上的jquery,在index.html中引入在线的1.9.1以上的jquery
<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
react-bootstrap参考:
https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-bootstrap
https://react-bootstrap.github.io/getting-started.html
End