reactjs – 在Semantic-UI-React中导入CSS
我将在我的项目中使用Semantic-UI-React,但我遇到了以下问题:
文档链接:https://react.semantic-ui.com/usage#css >文档说支持webpack 1,但不推荐.我正在使用随Webpack版本1.14.0一起提供的Create React App.那么这是否意味着我不应该将语义-UI-React与CRA一起使用? 我基本上尝试使用Semantic.UI-React和semantic.min.css以及我自己的一些样式.但似乎我在设置中犯了一些错误.另一种选择可能是继续使用Semantic UI CSS包吗? …但根据文档,我将无法使用此方法使用自定义样式. 我在这里有点困惑,请帮忙:) 解决方法
SUI-React文档评论不推荐使用Webpack 1只是因为它不是Webpack的最新版本. Webpack 1仍然可以正常工作.此外,当前版本的Create-React-App(1.0)使用Webpack 2,如果您没有“弹出”CRA项目,则可以轻松升级react-scripts依赖项以使用最新版本.
如果你想构建一个自定义的Semantic-UI CSS文件,是的,你将安装semantic-ui包,这将创建一个包含Semantic-UI的LESS源文件和构建系统的语义文件夹.从那里,您可以对SUI的自定义来源进行任何编辑.完成编辑后,在该语义文件夹中运行gulp build,它将创建一个包含已编译CSS文件的semantic / dist文件夹(根据https://semantic-ui.com/introduction/build-tools.html中的说明).最后,您可以将生成的CSS文件复制到项目中,可能在src文件夹中,然后将其导入JS源代码中. 如果你不关心生成自定义的Semantic-UI CSS构建,你可以npm install –save semantic-ui-css,它有一个预构建版本的默认Semantic-UI主题,并从那里导入CSS . 对于它的价值,我自己的“Practical Redux”教程系列使用了Semantic-UI-React和semantic-ui-css包,并展示了如何在Practical Redux,Part 4: UI Layout and Project Structure中添加语义ui-css.(我还使用了自定义Semantic-UI CSS在我的“真实”项目中构建.) (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |