Skip to content
Permalink
Newer
Older
100644 41 lines (36 sloc) 1.34 KB
October 19, 2023 16:49
1
import { CacheProvider } from "@emotion/react";
2
import createEmotionCache from "./createEmotionCache.js";
3
import { createEmotionServer } from "../emotion-server.js";
4
import { type EntryContext } from "@remix-run/cloudflare";
5
import { RemixServer } from "@remix-run/react";
6
import { renderToString } from "react-dom/server";
7
import { ServerStyleContext } from "./context.js";
8
9
export default function handleRequest(
10
request: Request,
11
responseStatusCode: number,
12
responseHeaders: Headers,
October 19, 2023 16:50
13
remixContext: EntryContext,
October 19, 2023 16:49
14
) {
October 19, 2023 16:49
15
const cache = createEmotionCache();
October 19, 2023 16:49
16
const { extractCriticalToChunks } = createEmotionServer(cache);
17
const html = renderToString(
18
<ServerStyleContext.Provider value={null}>
19
<CacheProvider value={cache}>
20
<RemixServer context={remixContext} url={request.url} />
21
</CacheProvider>
October 19, 2023 16:50
22
</ServerStyleContext.Provider>,
October 19, 2023 16:49
23
);
24
25
const chunks = extractCriticalToChunks(html);
26
27
const markup = renderToString(
28
<ServerStyleContext.Provider value={chunks.styles}>
29
<CacheProvider value={cache}>
30
<RemixServer context={remixContext} url={request.url} />
31
</CacheProvider>
October 19, 2023 16:50
32
</ServerStyleContext.Provider>,
October 19, 2023 16:49
33
);
34
35
responseHeaders.set("content-type", "text/html;charset=utf-8");
36
37
return new Response("<!DOCTYPE html>" + markup, {
38
headers: responseHeaders,
39
status: responseStatusCode,
40
});
41
}