Reactjs 在语义UI中导入CSS

我将在我的项目中使用语义UI React，但我遇到了以下问题：

文档链接：

文档称支持Webpack1，但不推荐使用。我正在使用网页包版本1.14.0附带的Create React应用程序。那么这是否意味着我不应该对CRA使用

语义UI React

对于样式，我还希望在我的项目中使用一些自定义样式，因此我选择了文档中提到的

语义UI

包的第三个选项。。

npm安装语义ui——保存dev

在内部运行

gulp

，并创建

semantic

文件夹。但是没有文档中提到的

dist

文件夹。我应该从哪个路径引用index.js文件中的

semantic.min.css

我基本上是在尝试使用

Semantic UI React

和

Semantic.min.css

以及一些我自己的风格。但我似乎在设置中犯了一些错误。另一种选择可能是继续使用

语义UI CSS

包。。。但根据文档，我将无法使用此方法的自定义样式

---

我在这里有点困惑，请帮助：）

关于不推荐使用Webpack 1的评论只是因为它不是Webpack的最新版本。Webpack1总体上仍然可以正常工作。此外，当前版本的Create React App（1.0）使用Webpack 2，如果您尚未“弹出”CRA项目，您可以轻松升级

React脚本

依赖项以使用最新版本

如果您想构建自定义语义UI CSS文件，是的，您将安装

语义UI

包，这将创建一个

语义

文件夹，其中包含语义UI较少的源文件并构建系统。从那里，您可以对SUI的源代码进行任何编辑，以进行自定义。编辑完成后，在

semantic

文件夹中运行

gulp build

，它将创建一个

semantic/dist

文件夹，其中包含已编译的CSS文件（按照中的说明）。最后，将生成的CSS文件复制到项目中，可能在

src

文件夹中，然后将这些文件导入JS源代码中

如果您不关心生成定制的语义UI CSS构建，您可以

npm安装--保存语义UI CSS

，它具有默认语义UI主题的预构建版本，并从那里导入CSS

---

值得一提的是，我自己的教程系列使用了Semantic UI React和

Semantic UI css

包，并且我展示了如何在中添加

Semantic UI css

。（我在工作中的“real”项目中也使用了自定义语义UI CSS构建。）

非常感谢您的回答，您的“实用Redux”教程也非常精彩！您对语义ui和语义ui的性能有何反馈？我读过一些帖子，他们提到网页的构建太大了。到目前为止，它是否在大小方面给您带来了麻烦？老实说，我正在开发的特定应用程序仍处于原型阶段，我们还没有处理捆绑包大小优化问题。我要说的是，SUI和SUI React看起来都有点大，所以如果你想创建一个高度优化的捆绑包，它们可能不是最好的选择，但它们提供了很多功能和良好的开箱即用的基本外观。我的项目也处于非常初级的阶段，所以，如果尺寸是一个问题，我可能会寻找其他的选择。我真的很喜欢antd库，但他们的文档的一部分仍然没有翻译。React引导看起来也是一个选项。你对React bootstrap和antd有什么看法？还没有认真研究过它们。