Я пытаюсь проверить карусель, но когда я загружаю страницу, она пуста.React Bootstrap Компоненты не отображаются
Установленный реактивный бутстрап с npm.
Код карусели от https://react-bootstrap.github.io/components.html#media-content. Я посмотрел на свою веб-консоль, и у меня нет никаких предупреждений или ошибок.
carousal.js
import React, { Component } from 'react';
import {Carousel} from 'react-bootstrap';
class carousel extends Component {
render() {
return (
<Carousel>
<Carousel.Item>
<img width={900} height={500} alt="900x500" src={require('./images/cs_logo.png')}/>
<Carousel.Caption>
<h3>First slide label</h3>
<p>Nulla vitae elit libero, a pharetra augue mollis interdum.</p>
</Carousel.Caption>
</Carousel.Item>
<Carousel.Item>
<img width={900} height={500} alt="900x500" src={require('./images/cs_logo.png')}/>
<Carousel.Caption>
<h3>Second slide label</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</Carousel.Caption>
</Carousel.Item>
<Carousel.Item>
<img width={900} height={500} alt="900x500" src={require('./images/cs_logo.png')}/>
<Carousel.Caption>
<h3>Third slide label</h3>
<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur.</p>
</Carousel.Caption>
</Carousel.Item>
</Carousel>
);
}
}
export default carousel;
index.js
import React from 'react';
import ReactDOM from 'react-dom';
import carousel from './carousal';
ReactDOM.render(<carousel/>,document.getElementById('root'));
index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">
<title>title</title>
</head>
<body>
<header>
<div id="nav"></div>
</header>
<div id="root" style="text-align: center; float: none"></div>
</body>
</html>
Я пытался добавить его и теперь я получаю эту ошибку в консоли «реагировать-bootstrap.js: 2037 Uncaught TypeError: Не удается прочитать свойство 'PropTypes' неопределенных (...) экспорт .__ esModule @ реагирующие-bootstrap.js: 2037__webpack_require__ @ react-bootstrap.js: 30exports .__ esModule @ react-bootstrap.js: 430__webpack_require__ @ react-bootstrap.js: 30exports .__ esModule @ react-bootstrap.js: 62__webpack_require__ @ react-bootstrap.js: 30exports .__ esModule @ react-bootstrap .js: 50 (анонимная функция) @ react-bootstrap.js: 53webpackUniversalModuleDefinition @ react-bootstrap.js: 9 (анонимная функция) @ react-bootstrap.js: 10 " – user3034572