function createPageContext() { return { theme, // This is needed in order to deduplicate the injection of CSS in the page. sheetsManager: new Map(), // This is needed in order to inject the critical CSS. sheetsRegistry: new SheetsRegistry(), // The standard class name generator. generateClassName: createGenerateClassName(), }; }
const renderer = (req, store) => { const sheetsRegistry = new SheetsRegistry(); const jss = create(preset()); const generateClassName = createGenerateClassName(); const context = {} const helmet = Helmet.renderStatic() const content = renderToString( <JssProvider registry={sheetsRegistry} jss={jss} generateClassName={generateClassName}> <MuiThemeProvider theme={theme} sheetsManager={new Map()}> <Provider store={store}> <StaticRouter location={req.url} context={context}> <App /> </StaticRouter> </Provider> </MuiThemeProvider> </JssProvider> ) const css = sheetsRegistry.toString() return `<!doctype html>\n${renderToString(Html({content, css, store}))}` }