如何选择Reaction Style-Components来生成物理的css文件？ [英] How can I opt for React Styled-Components to generate a physical CSS file?

问题描述

我需要将提供给styled-components的css输出到public/css目录中的物理css文件。

export const MyComp = styled.div`
  width: 100%;
  height: 500px;
`

与所有其他样式化组件的样式一起，上述组件将输出到public/css/styled.css：

.Components_MyComp__a39t9ag0248f {
  width: 100%;
  height: 500px;
}

我正在使用：

"webpack": "^2.6.1",
"styled-components": "^2.0.1",

推荐答案

当前不可能/不支持。提取静态样式非常困难，例如，考虑函数内插：

const Test = styled.div`
  color: ${props => props.color};
`

我们如何提取它？我们只能提取CSS的静态部分，但有很多边缘情况和约束，这使得构建起来很困难。

我们目前正在调查和试验，以找出最好的方法可能是什么。现在，请查看我们的Babel plugin，以了解在编译时步骤中正在进行的一些工作！

这篇关于如何选择Reaction Style-Components来生成物理的css文件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！