Question

我正在使用create-react-app，样式化的组件和twin.macro将顺风类应用于我的React元素。效果很好。

我有一小部分无法应用的规则，因为两者之一

应将其应用于的元素不在react应用范围（body，＃root）
样式应全局应用，而不是应用于特定元素。

这就是我想要成为我的全局样式表的地方。

    body {
      @apply bg-gray-100 select-none;
    }
    
    #root {
      @apply h-screen text-sm;
    }
    
    input:focus,
    select:focus,
    textarea:focus,
    button:focus,
    div[contenteditable]:focus {
      @apply outline-none
    }

twin.macro是否提供添加全局样式的功能？如果不是，我最好的选择是什么。

Answer 1

使用所选的css-in-js软件包提供的全局样式：

感谢使用twin：）

Answer 2

twin.macro是否提供添加全局样式的功能？答案是

twin.macro使用来自styled-component / @ emotion的全局样式（但默认情况下，它使用@emotion）。但请放心，您可以使用样式化组件进行更改

您遵循这些步骤了吗？

https://github.com/ben-rogerson/twin.macro/blob/master/docs/styled-components/create-react-app.md

使用样式化组件和twin.macro设置全局样式的React应用

2 个答案: