Razzle: 제대로 렌더링되지 않는 스타일의 수화

ㅋㅋㅋㅋ Razzle의 Material UI에서도 같은 문제가 있었습니다 😢

@CharlyJazz 정말 용기가 납니다. 하하 withStyles 구현에서 동형 클래스로 이동하려고 했습니까?

길고 지루한 시간 동안 조사하고 디버깅한 후에는 조금 더 만족스러울 것이라고 생각할 수 있지만 수정은 기본적으로 after.js, react-jss를 사용하여 자신만의 Document 를 생성한 다음 맨 아래에 있는 줄을 생성하는 것입니다. 이 스레드의 (MUI 관련만 있는 MuiThemeProvider 정보):

  static async getInitialProps({ assets, data, renderPage }) {
    const generateClassName = createGenerateClassName()
    const jss = create(jssPreset())

    const page = await renderPage(App => props => (
      <JssProvider jss={jss} generateClassName={generateClassName}>
        <MuiThemeProvider sheetsManager={new Map()}>
          <App {...props} />
        </MuiThemeProvider>
      </JssProvider>
    ))

    return { assets, data, ...page }
  }

모두 고통을 피하십시오. :피

@jaredpalmer @jylinman razzle 문서에 대한 예제를 만드는 것이 불가능합니까?

이 문제를 겪고 있는 다른 사람에게는 공식 Material-UI SSR 문서를 따르는 것이 좋습니다. https://material-ui.com/guides/server-rendering/