mirror of
https://github.com/betagouv/mon-entreprise
synced 2025-02-09 05:15:02 +00:00
Désormais nous utilisons un script NodeJS natif pour générer le code HTML pour le pré-rendu des pages. Cela est plus rapide et plus fiable que la méthode précédente qui consistait un instrumentaliser un navigateur (pupetter) https://github.com/chrisvfritz/prerender-spa-plugin Cela implique toutefois de faire attention à ne plus utiliser des variables gloables du navigateur, comme `window`, `document` ou `location` dans nos scripts. C'est plutôt une bonne pratique, mais il faudrait sans doute configurer du typage pour détecter ces usages le plus tôt possible et éviter de créer des erreurs inopinées avec le SSR.
31 lines
989 B
TypeScript
31 lines
989 B
TypeScript
import ReactDOMServer from 'react-dom/server'
|
|
import { SSRProvider } from '@react-aria/ssr'
|
|
import { StaticRouter } from 'react-router-dom'
|
|
import i18next from './locales/i18n'
|
|
import { AppFr } from './entry.fr'
|
|
import { AppEn } from './entry.en'
|
|
import { ServerStyleSheet, StyleSheetManager } from 'styled-components'
|
|
import { FilledContext, HelmetProvider } from 'react-helmet-async'
|
|
|
|
export function render(url: string, lang: 'fr' | 'en') {
|
|
const sheet = new ServerStyleSheet()
|
|
const helmetContext = {} as FilledContext
|
|
const App = lang === 'fr' ? AppFr : AppEn
|
|
i18next.changeLanguage(lang)
|
|
|
|
const html = ReactDOMServer.renderToString(
|
|
<SSRProvider>
|
|
<HelmetProvider context={helmetContext}>
|
|
<StyleSheetManager sheet={sheet.instance}>
|
|
<StaticRouter location={url}>
|
|
<App />
|
|
</StaticRouter>
|
|
</StyleSheetManager>
|
|
</HelmetProvider>
|
|
</SSRProvider>
|
|
)
|
|
|
|
const styleTags = sheet.getStyleTags()
|
|
|
|
return { html, styleTags, helmet: helmetContext.helmet }
|
|
}
|