问题标签 [astroturf]

我在 CSS-IN-JS 项目中使用 stylelint（这里使用 astroturf，但我也面临使用任何 CSS-IN-JS 库（如 styled-components）的相同模式）。

我在同一个文件中定义了不同样式的元素，因此有时最终会出现重复的选择器和/或导入规则。

我这样写的：

有没有办法在块而不是整个文件上设置这些 stylelint 规则？

我尝试使用它的 babel 插件，但是没有用。

我也在使用 craco 来扩展/自定义 Create React App，但我不知道足够的 Webpack 来让 craco 与 Astroturf 一起工作。

我遇到了一个“问题”，这让我觉得我为我想要的东西选择了错误的堆栈。我对 React 和 Typescript 很陌生，但我想知道是否有人也知道以下方法。

主题.ts

样式.ts

我收到以下错误消息，这确实有意义

无法将插值解析为值、css 返回的类名或样式化组件。所有插值样式的组件必须在同一个文件中，并且值必须在编译时静态确定

我正在使用 postcss 运行 webpack，但也尝试使用样式组件中的主题。最终目标是使用拨动开关将主题从亮/暗更改，但我只需要一些关于我应该采取什么方法的指导。显然，用 astroturf 为 postcss 实现 css-in-js 将会对我使用主题的方式产生问题，但我想在我把它撕掉之前问你们。

可能有一个我缺少的简单解决方案。我尝试只导入变量 light 和 dark，然后尝试在我的 css 字符串中使用这些变量，但这也不起作用。

提前致谢