将 Reactstrap 与 Parcel 一起使用时没有应用样式

Question

我正在使用parcel 来捆绑我的代码，并使用reactstrap 来设置我的react 应用程序的样式。我有一个例子：

import React from "react";
import { Button } from "reactstrap";

const Layout = () => {
  return (
    <>
      <header></header>
      <Button color="danger">Danger!</Button>
    </>
  );
};

export default Layout;

这应该创建一个漂亮的红色按钮。但是当我使用parcel（在开发模式下）运行该应用程序时，它给了我一个普通按钮，但是该按钮应用了一个classname（btn btn-danger）。结果如下：

parcel 和 reactstrap 有什么问题？我怎样才能摆脱这个问题？

Answer 1

您必须安装 bootstrap 软件包，然后在您的 index.js 文件中添加 bootstrap.min.css：

安装bootstrap包：

npm install --save bootstrap

将bootstrap.min.css 添加到您的index.js 文件中：

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