Pourquoi ne sont pas mes Réagir Bootstrap Glyphicons montrant?
Je suis l'aide de Réagir Bootstrap est Glyphicon
composant, mais aucun des glyphicons sont en train d'apparaître. Voici mon code pour l'instant:
Index.js
import React from 'react';
import ReactDOM from 'react-dom';
import Global from './components/Global';
ReactDOM.render(
<Global />,
document.getElementById('root')
);
Global.js
import React, { Component } from 'react';
import { FormGroup, FormControl, InputGroup, Glyphicon } from 'react-bootstrap';
class Global extends Component {
render() {
return(
<div>
<h2> Book Explorer!</h2>
<FormGroup>
<InputGroup>
<FormControl
type="text"
placeholder="Search for a book"
/>
<InputGroup.Addon>
<Glyphicon glyph="search"></Glyphicon>
</InputGroup.Addon>
</InputGroup>
</FormGroup>
</div>
)
}
}
export default Global;
Voici mon package.json
fichier:
{
"name": "setup",
"version": "1.0.0",
"babel": {
"presets": [
"es2015",
"react"
]
},
"description": "",
"main": "index.js",
"scripts": {
"build": "webpack",
"start": "webpack-dev-server"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"babel-core": "^6.22.1",
"babel-loader": "^6.2.10",
"babel-polyfill": "^6.22.0",
"babel-preset-es2015": "^6.22.0",
"babel-preset-react": "^6.24.1",
"react": "^15.5.4",
"react-bootstrap": "^0.31.0",
"react-dom": "^15.5.4",
"webpack": "^1.14.0",
"webpack-dev-server": "^1.16.2"
}
}
Hé merci pour le commentaire, je suis avec un udemy cours et il stipule rien que de l'inclure dans le index.html pouvez-vous donner des précisions sur la façon de le faire s'il vous plaît? Je vous remercie.
OriginalL'auteur Peter Tran | 2017-05-12
Vous devez vous connecter pour publier un commentaire.
C'est parce que Bootstrap utilise la police Gylphicon les Hobbits pour afficher son glyphicons. Bootstrap CSS doit être explicitement inclus, comme il importe les glyphicons, ou encore les glyphicons ne sera pas affiché. Vous pouvez ajouter la
bootstrap.min.css
fichier sur votreindex.html
qui importe pour vous:Il y a un problème posées sur GitHub concernant ce problème précis. Il n'est pas explicitement dit que vous devez inclure Bootstrap CSS, et j'ai rencontré ce problème avant. Vous devez inclure le fichier CSS ou encore les glyphicons ne seront pas importés et vos composants affichera rien.
OriginalL'auteur Li357