Twitter bootstrap React引导类样式不'；不适用

我通过导入react引导组件来使用react引导，但是由于某些原因，类样式没有应用于元素，尽管我可以看到引导类被赋予了DOM中相应的元素。我使用自己的类进行定位，它不会覆盖任何内容。有人知道什么地方可能出错吗？例如：

import React, { Component } from 'react'
import {Alert} from 'react-bootstrap'

class Error extends Component {
render() {
const {errorText} = this.props
return (
  <Alert bsStyle="warning" className="error-container">
    <div className="error-msg">{errorText}</div>
  </Alert>
);
}
}

import React，{Component}来自“React”
从“react bootstrap”导入{Alert}
类错误扩展组件{
render（）{
const{errorText}=this.props
返回(
{errorText}
);
}
}

您的代码不应用样式，因为缺少引导CSS资源。 正如您所注意到的，

Alert

组件正确地应用了类名。 最后，类名没有应用正确的样式，因为缺少引导CSS资源

对于这种情况，一个最低可行的修复方法是导入小型引导CSS：

1。安装引导程序库

安装引导程序

2。在步骤1之后，从node_modules文件夹将缩小的引导CSS添加到index.js

我们还将警报组件导入更改为仅导入警报功能，而不是整个react引导库

以下是您的实施示例，仅导入警报组件：

index.js

--

导入'bootstrap/dist/css/bootstrap.min.css'；
从“React”导入React，{Component}
从“反应引导/警报”导入警报
类错误扩展组件{
render（）{
const{errorText}=this.props；
返回(
{errorText}
);
}
}

您是否在某个地方添加了引导样式表，可能是在

索引

html文件中，如本文所述。

index.js

import 'bootstrap/dist/css/bootstrap.min.css';
import React, { Component } from 'react'
import Alert from 'react-bootstrap/Alert'

class Error extends Component {
  render() {
    const { errorText } = this.props;
    return (
        <Alert bsStyle="warning" className="error-container">
          <div className="error-msg">{errorText}</div>
        </Alert>
    );
  }
}