用react-jss 获取FOUC 是必然的吗？

Question

react-jss 问题：

React-jss global FOUC (A flash of unstyled content) 的风险22=]styles，因为我们无法将样式导出为真实样式css？（因为来自 JSS 的样式表仅在脚本为运行时呈现）。
我可以使用从 'react-jss' 生成的 webpack 导出真正的样式表吗？

我在 root.tsx 文件中使用全局 jss 样式，如下所示：

import {createUseStyles} from 'react-jss'
import styles from '../../style/root.style'

并在 root.style.ts

export default {
    '@global': {
        h1: {
            extend: typography.h1,
            color: colors.moss.regular,
        },
        h2: {
            extend: typography.h2,....

Answer 1

为了避免 FOUC，你需要 SSR，react-jss 有一个 API 允许你在 SSR 期间获取样式并将它们插入样式标签内的文档头部。

稍后在渲染js客户端时，您可以删除来自SSR的样式元素。

https://cssinjs.org/react-jss/#server-side-rendering

用react-jss 获取FOUC 是必然的吗？

Is it inevitable to get FOUC with react-jss?

reactjs

webpack

css-in-js