public/hornwitser.no
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Reload page when watch restarts serve

Browse source 
Host an EventSource server that notifies current open browser windows
to reload the page when the watch mode has restarted the server.  This
is the last piece to making the page update live after editing and
saving a source file.
This commit is contained in:
Hornwitser 2025-02-03 10:30:35 +01:00
parent 7c9ca7c3ae
commit 3bcf621a1c
5 changed files with 139 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/components/BasePage.tsx
View file

@ -5,6 +5,14 @@ interface BaseProps {
children: Node | Node[],
}
export default function BasePage(props: BaseProps) {
let reloadScript = null;
if (process.env.DEV_EVENT_PORT) {
const content = `const url = new URL("/events", location);
url.port = ${process.env.DEV_EVENT_PORT};
const source = new EventSource(url);
source.addEventListener("reload", () => location.reload());`;
reloadScript = <script type="module" defer="">{content}</script>;
}
return <html lang="en">
<head>
<meta charset="utf-8" />
@ -12,6 +20,7 @@ export default function BasePage(props: BaseProps) {
<meta name="viewport" content="width=device-width" />
<link rel="stylesheet" href="/style.css" />
<script type="module" defer="" src="viewport.js" />
{ reloadScript }
</head>
<body>
<header class="header">