Почему мои загрузки технологии glyphicons реагируют показывает?
Я использую реагировать Bootstrap В. Glyphicon
компонент, но ни одна из технологии glyphicons появляется. Вот мой код до сих пор:
Индекс.js
import React from 'react';
import ReactDOM from 'react-dom';
import Global from './components/Global';
ReactDOM.render(
<Global />,
document.getElementById('root')
);
Глобальный.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;
Вот мой файл package.json
:
{
"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"
}
}
1 ответ:
Это потому, что загрузчик использует шрифт Gylphicon полурослики, чтобы отобразить его технологии glyphicons. УСБ загрузчик должен быть явно включен, так как он импортирует технологии glyphicons, или технологии glyphicons не появится. Вы можете добавить файл
bootstrap.min.css
к вашему файлуindex.html
, который импортирует его для вас:<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">