React-Bootstrap Help Getting Started

React-Bootstrap Help Getting Started
0

#1

Hey everyone, I am just starting to use React-Bootstrap and having issues getting any of the components in this framework to render to the screen. Here is a simple example of rendering a component and my codepen link:

var Button = ReactBootstrap.Button;
class App extends React.Component{
  
  render(){
    return(
      <div>
        <div>This Renders</div>
        <Button>This Doesn't</Button>
      </div>
    )
  }
}

ReactDOM.render(
<App/>,
  document.getElementById("app")
)

https://codepen.io/InfiniteSet/pen/xLNLox

Any help would be much appreciated, thank you!


#2

If you have worked in JavaScript before, you will remember the console will show errors if there are any. In Chome use Ctrl+Shft+I to access the developer tools and view the console.

You are getting the following 2 errors in the console:

Uncaught TypeError: Cannot read property ‘propTypes’ of undefined
at Object.r [as default] (react-bootstrap.min.js:13)
at Object. (react-bootstrap.min.js:6)
at t (react-bootstrap.min.js:1)
at Object.t.exports (react-bootstrap.min.js:1)
at t (react-bootstrap.min.js:1)
at react-bootstrap.min.js:1
at react-bootstrap.min.js:1
at react-bootstrap.min.js:1
at react-bootstrap.min.js:1
pen.js:9

Uncaught ReferenceError: ReactBootstrap is not defined at pen.js:9


#3

Honestly don’t know why it doesn’t work in your pen. I forked your pen, changed version of react-bootstrap to 0.30.5 and now it works fine.
https://codepen.io/prokhorova_ann26/pen/xLNXYE


#4

I guess I will be using this version of React-Bootstrap for the time being, thank you!