css react-helmet全局样式:头部中的根样式块标记

dbf7pr2w  于 2023-02-20  发布在  React
关注(0)|答案(1)|浏览(164)

是否可以添加带有CSS变量的:root样式块,以便于react中的全局样式?我已将以下内容添加到我的layout.tsx页面,但在运行时得到一个空白页面(Visual Studio 2022 react项目)。如果我添加 meta标记而不是样式块,则meta标记会呈现在页面上,因此react-helmet已安装并正常工作。当我将鼠标悬停在style标记上时,我还收到错误“(ts)cannot find name --mainThemeF”in Visual Studio。
是layout.tsx的正确位置,把这个添加全局样式或有一个更好的网页,可以作为一个“主”类型的网页?这是甚至正确的方式来添加全局样式的React,因为我有点新的。谢谢。

<React.Fragment>
        <Helmet>
            <style type="text/css">
                :root {
                    --mainThemeF: #ffffff;
                    --mainThemeB: #006633;
                    etc...
                 {
             </style>
         </Helmet>
fae0ux8s

fae0ux8s1#

Fixed it...boom. It was in the docs, why didn't i just read the docs

<React.Fragment>
        <Helmet>
            <style type="text/css">{`
            :root {
                --mainThemeF: #ffffff;
                --mainThemeB: #006633;                    
             {
         `}</style>
     </Helmet>

相关问题