create-react-app - create-react-app 从节点模块导入 css

Question

我对反应很陌生。我刚刚开始遵循说明并尝试使用 create-react-app。创建一个空应用程序后，我尝试添加一个来自react-bootstrap-table的网格。

下面非常简单的代码：

import 'react-bootstrap-table/dist/react-bootstrap-table-all.min.css';
import React from 'react';     
import ReactDOM from 'react-dom';
import { BootstrapTable, TableHeaderColumn } from 'react-bootstrap-table'; 

var products = [{
      id: 1,
      name: "Item name 1",
      price: 100
  },{
      id: 2,
      name: "Item name 2",
      price: 100
  }];

function priceFormatter(cell, row){
  return '<i class="glyphicon glyphicon-usd"></i> ' + cell;
}

ReactDOM.render(
  <BootstrapTable data={products} striped={true} hover={true}>
      <TableHeaderColumn dataField="id" isKey={true} dataAlign="center" dataSort={true}>Product ID</TableHeaderColumn>
      <TableHeaderColumn dataField="name" dataSort={true}>Product Name</TableHeaderColumn>
      <TableHeaderColumn dataField="price" dataFormat={priceFormatter}>Product Price</TableHeaderColumn>
  </BootstrapTable>,
        document.getElementById("root") 
);

但是，它似乎无法正确加载样式表。

我也尝试过使用：

require('react-bootstrap-table/dist/react-bootstrap-table-all.min.css') 

根据其他帖子的建议，但没有运气。

我犯了什么错误吗？

Answer 1

我最后想通了。看起来 github 中的 react-bootstrap-table 文档不完整，并且依赖于 bootstrap/react-bootstrap。

安装 react-bootstrap 后问题解决，并且 bootstrap 模块也导入 bootstrap css。

import 'bootstrap/dist/css/bootstrap.min.css';
import 'bootstrap/dist/css/bootstrap-theme.min.css';