blob: 0e28dac6543939b1942c5adb5aa824f09a33f843 (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
|
import ReactDOMServer from "react-dom/server.browser";
addEventListener("fetch", async (event: FetchEvent) => {
var route = Wundle.match(event);
console.log("Main:", Wundle.main);
console.log("cwd:", Wundle.cwd);
console.log("Origin:", Wundle.origin);
const { default: PageComponent } = await import(route.filePath);
// This returns all .css files that were imported in the line above.
// It's recursive, so any file that imports a CSS file will be included.
const stylesheets = Wundle.getImportedStyles() as string[];
const response = new Response(`
<!DOCTYPE html>
<html>
<head>
${stylesheets
.map((style) => `<link rel="stylesheet" href="${style}">`)
.join("\n")}
<link
rel="stylesheet"
crossorigin="anonymous"
href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;700&family=Space+Mono:wght@400;700"
/>
</head>
<body>
<div id="reactroot">${ReactDOMServer.renderToString(
<PageComponent />
)}</div>
<script src="${route.scriptSrc}" async type="module"></script>
</body>
</html>
`);
event.respondWith(response);
});
// typescript isolated modules
export {};
declare var Wundle: any;
|