2017-07-17 4 views
1

Wie der Titel schon sagt, folgte ich die Installationsschritten gemäß der Bootstrap und React-Bootstrap-Dokumentation nach create-react-app mit:können nicht anwenden Bootstrap oder Reaktivierungs Bootstrap Stile mit create-reagieren-App erstellt App

npm install --save react-bootstrap [email protected] 

enthalten dann einen Link zu dem Bootstrap CDN in index.html für alle Fälle:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">

Hier ist der Anfang meiner app reagieren, die nicht die Stile richtig gilt:

MyNavbar.jsx

:

import React, { Component } from 'react'; 
import {Navbar} from 'react-bootstrap'; 
import {Nav} from 'react-bootstrap'; 
import {NavItem} from 'react-bootstrap'; 
import 'bootstrap/dist/css/bootstrap.css'; 

class MyNavbar extends Component { 
    render() { 
     return(
      <div> 
       <Navbar> 
        <Navbar.Header> 
         <Navbar.Brand> 
          <a href="#"> grood </a> 
         </Navbar.Brand> 
        </Navbar.Header> 
        <Nav> 
         <NavItem eventKey={2} href="#"> For Eateries </NavItem> 
        </Nav> 
       </Navbar> 
      </div> 
     ) 
    } 
} 

export default MyNavbar; 

App.js:

import React, { Component } from 'react'; 
import MyNavbar from './MyNavbar.jsx' 
import 'bootstrap/dist/css/bootstrap.css'; 

class App extends Component { 
    render() { 
     return (
      <div className="App"> 
       <MyNavbar /> 
      </div> 
     ); 
    } 
} 

export default App; 

Sowohl MyNavbar und App sind in der gleichen src Datei

+0

Können Sie die Fehler posten, die Sie bekommen? – tomr

Antwort

0

react-bootstrap für Bootstrap ist bauen - nicht .

Installieren Sie das Paket bootstrap 3 in Ihr Projekt und importieren Sie dort css.

Es gibt ein Projekt für React & Bootstrap 4 obwohl: reactstrap.

+0

Vielen Dank für die Klärung. Wissen Sie, ob der reactstrap in irgendeiner Weise dem react-bootstrap unterlegen ist? – VWang

+0

Ich habe kein Reactstrap verwendet, da Bootstrap 4 Alpha ist und noch keine Option für die Produktion. –

Verwandte Themen