[react] 怎么在React中引入其它的UI库，例如Bootstrap

haizlin / fe-interview

前端面试每日 3+1，以面试题来驱动学习，提倡每日学习与思考，每天进步一点！每天早上5点纯手工发布面试题（死磕自己，愉悦大家），6000+道前端面试题全面覆盖，HTML/CSS/JavaScript/Vue/React/Nodejs/TypeScript/ECMAScritpt/Webpack/Jquery/小程序/软技能……

http://www.h-camel.com

MIT License

25.5k stars 3.26k forks source link

[react] 怎么在React中引入其它的UI库，例如Bootstrap #893

Open haizhilin2013 opened 5 years ago

haizhilin2013 commented 5 years ago

[react] 怎么在React中引入其它的UI库，例如Bootstrap

idododu commented 4 years ago

// create-react-app
yarn add bootstrap
yarn add material-ui

liuyingbin19222 commented 4 years ago

下载bootstrap , 配置webpack , build, 通过index.html 导入,可以使用bootstrap效果。

zhaofeipeter commented 4 years ago

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';

在需要用到bootstrap组件的代码中，引入所需组件。 import { Navbar, Jumbotron, Button } from 'react-bootstrap';

LoveWei0 commented 1 year ago

安装相应的依赖

npm install react-bootstrap

2.在 index.js中如样式

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

在组件中使用时,按需加载

import { } from 'react-bootstrap'