javascript - 使用 styled-components 的 createGlobalStyle() 从文件创建全局样式

Question

我目前正在尝试在我的 React 应用程序中结合 styled-components 和 react-bootstrap。我想使用 react-bootstrap 附带的全局样式表，我目前正在使用 import "bootstrap/dist/css/bootstrap.min.css"; .
文档确实有一些示例，我想我了解如何创建全局样式的基本思想。但是，样式组件希望我导入全局样式表的方式似乎是调用 createGlobalStyle()在文件的 CSS 上，但我看到的每个示例都是在模板字符串上调用函数。我在这里唯一的选择真的是将整个CSS文件作为字符串读取并将其输入createGlobalStyle吗？ ?

Answer 1

更多的挖掘已经产生了答案。开发控制台内的 createGlobalStyle 生成的警告如下:

GlobalStyle.js:28 Please do not use @import CSS syntax in createGlobalStyle at this time, as the CSSOM APIs we use in production do not handle it well. Instead, we recommend using a library such as react-helmet to inject a typical meta tag to the stylesheet, or simply embedding it manually in your index.html section for a simpler app.

似乎导入css文件的正确方法是将其简单地添加到 Helm 中。