Web Dev Solutions

Catalin Mititiuc

aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--esbuild-server.mjs64
-rw-r--r--public/index.html4
2 files changed, 59 insertions, 9 deletions
diff --git a/esbuild-server.mjs b/esbuild-server.mjs
index 15ee06d..323a97e 100644
--- a/esbuild-server.mjs
+++ b/esbuild-server.mjs
@@ -24,6 +24,55 @@ const mime = {
'.html': 'text/html; charset=utf-8',
};
+function createServerSentEventHandler() {
+ const listeners = new Set();
+ const setupConnection = (req, res) => {
+ // res.writeHead(200, {
+ // 'Content-Type': 'text/event-stream',
+ // 'Cache-Control': 'no-cache',
+ // Connection: 'keep-alive',
+ // });
+ listeners.add(res);
+ // req.on('close', () => {
+ // listeners.delete(res);
+ // });
+ };
+
+ const sendMessage = (data) => {
+ listeners.forEach((res) => {
+ res.write(`data: ${JSON.stringify(data)}\n\n`);
+ });
+ };
+
+ return { setupConnection, sendMessage };
+}
+
+const buildListeners = createServerSentEventHandler();
+
+const buildStatusPlugin = {
+ name: 'build-status',
+ setup(build) {
+ let buildStart = Date.now();
+ let buildResolver = () => {};
+ let buildPromise = Promise.resolve();
+
+ build.onStart(() => {
+ buildStart = Date.now();
+ buildPromise = new Promise((resolve) => {
+ buildResolver = resolve;
+ });
+ buildListeners.sendMessage({ type: 'build-start' });
+ });
+ build.onEnd((result) => {
+ const duration = Date.now() - buildStart;
+ buildStart = -1;
+ buildResolver();
+ const success = result.errors.length === 0;
+ buildListeners.sendMessage({ type: 'build-end', duration, success });
+ });
+ },
+};
+
const importSvg = {
name: 'importSvg',
setup(build) {
@@ -80,13 +129,6 @@ const importSvg = {
resolveDir: path.dirname(args.path) //'./public/assets/images'
}
});
-
- // build.onLoad({ filter: /.*/, namespace: 'svg-stub' }, async (args) => ({
- // contents: `import svg from ${JSON.stringify(args.path)}
- // export default (imports) =>
- // WebAssembly.instantiate(wasm, imports).then(
- // result => result.instance.exports)`,
- // }));
}
};
@@ -174,11 +216,16 @@ const ctx = await esbuild.context({
entryPoints: ['src/index.js', 'src/soldier_record_block.js', 'src/map.js'],
bundle: true,
outdir: 'build',
- plugins: [resolveSvgImports, externalSvgToInternal],
+ plugins: [
+ resolveSvgImports,
+ externalSvgToInternal,
+ // buildStatusPlugin
+ ],
loader: {
'.svg': 'file'
},
assetNames: 'assets/images/[name]-[hash]',
+ metafile: true
});
await ctx.watch();
@@ -231,6 +278,7 @@ http.createServer((req, res) => {
const type = proxyRes.headers['content-type'];
console.log(`${req.method} ${req.url} => ${proxyRes.statusCode} ${type} via esbuild`);
res.writeHead(proxyRes.statusCode, { 'content-type': type });
+ // if (req.url === '/esbuild') buildListeners.setupConnection(req, res);
proxyRes.pipe(res);
});
diff --git a/public/index.html b/public/index.html
index 5badb7c..0307115 100644
--- a/public/index.html
+++ b/public/index.html
@@ -244,7 +244,9 @@
<input type="file" accept="image/svg+xml"/>
<script>
- new EventSource('/esbuild').addEventListener('change', () => location.reload());
+ const source = new EventSource('/esbuild');
+ source.addEventListener('change', () => location.reload());
+ source.addEventListener('message', (e) => console.log(e));
</script>
<script src="index.js"></script>
<script src="soldier_record_block.js"></script>