Skip to content

Commit ba02b9a

Browse files
PlatanePlatane
committed
🏗️ use bun to bundle the demos
1 parent 3202fa1 commit ba02b9a

File tree

29 files changed

+246
-832
lines changed

29 files changed

+246
-832
lines changed

‎bun.lock‎

Lines changed: 6 additions & 675 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/demo/build.ts‎

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
import { rmSync } from "fs";
2+
import { join } from "path";
3+
4+
const outdir = join(import.meta.dir, "dist");
5+
rmSync(outdir, { recursive: true, force: true });
6+
7+
//
8+
// 1. build worker first to get its hashed filename
9+
const workerBuild = await Bun.build({
10+
entrypoints: [join(import.meta.dir, "interactive/worker.ts")],
11+
outdir,
12+
target: "browser",
13+
naming: "[name]-[hash].[ext]",
14+
});
15+
16+
if (!workerBuild.success) {
17+
console.error(workerBuild.logs);
18+
process.exit(1);
19+
}
20+
21+
const workerFile = "./" + workerBuild.outputs[0].path.split("/").at(-1)!;
22+
23+
//
24+
// 2. build all demos, injecting the worker url
25+
26+
const [interactiveBuild, demoBuild] = await Promise.all([
27+
// interactive -> dist/index.html (root)
28+
Bun.build({
29+
entrypoints: [join(import.meta.dir, "interactive/index.html")],
30+
outdir,
31+
root: join(import.meta.dir, "interactive"),
32+
target: "browser",
33+
define: {
34+
"process.env.WORKER_URL": JSON.stringify(workerFile),
35+
"process.env.GITHUB_USER_CONTRIBUTION_API_ENDPOINT": JSON.stringify(
36+
process.env.GITHUB_USER_CONTRIBUTION_API_ENDPOINT ?? "/",
37+
),
38+
},
39+
}),
40+
41+
// all other demos -> dist/{name}/index.html
42+
Bun.build({
43+
entrypoints: Array.from(
44+
new Bun.Glob("*/index.html").scanSync(import.meta.dir),
45+
)
46+
.filter((f) => !f.startsWith("dist/") && !f.startsWith("interactive/"))
47+
.map((f) => join(import.meta.dir, f)),
48+
outdir,
49+
target: "browser",
50+
}),
51+
]);
52+
53+
if (!interactiveBuild.success) {
54+
console.error(interactiveBuild.logs);
55+
process.exit(1);
56+
}
57+
58+
if (!demoBuild.success) {
59+
console.error(demoBuild.logs);
60+
process.exit(1);
61+
}

‎packages/demo/bunfig.toml‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
[serve.static]
2+
# the bun serve command does not support define options, it needs to read it from this bunfig file
3+
define = {
4+
"process.env.WORKER_URL": "'/worker.js'",
5+
"process.env.GITHUB_USER_CONTRIBUTION_API_ENDPOINT": "'/api/github-user-contribution/'"
6+
}

‎packages/demo/dev.ts‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import { serve } from "bun";
2+
import { getGithubUserContribution } from "../github-user-contribution";
3+
4+
import getBestRoute_page from "./getBestRoute/index.html";
5+
import getBestTunnel_page from "./getBestTunnel/index.html";
6+
import getPathTo_page from "./getPathTo/index.html";
7+
import getPathToPose_page from "./getPathToPose/index.html";
8+
import interactive_page from "./interactive/index.html";
9+
import outside_page from "./outside/index.html";
10+
import svg_page from "./svg/index.html";
11+
12+
const server = serve({
13+
routes: {
14+
"/": interactive_page,
15+
"/getBestRoute": getBestRoute_page,
16+
"/getBestTunnel": getBestTunnel_page,
17+
"/outside": outside_page,
18+
"/getPathToPose": getPathToPose_page,
19+
"/getPathTo": getPathTo_page,
20+
"/svg": svg_page,
21+
22+
"/worker.js": async () =>
23+
Bun.build({
24+
entrypoints: [__dirname + "/interactive/worker.ts"],
25+
target: "browser",
26+
})
27+
.then((b) => b.outputs[0].text())
28+
.then(
29+
(content) =>
30+
new Response(content, {
31+
headers: { "Content-Type": "application/javascript" },
32+
}),
33+
),
34+
35+
"/api/github-user-contribution/:username": async (req) => {
36+
const githubToken = process.env.GITHUB_TOKEN!;
37+
const data = await getGithubUserContribution(req.params.username, {
38+
githubToken,
39+
});
40+
return Response.json(data);
41+
},
42+
},
43+
44+
development: { hmr: false },
45+
});
46+
47+
console.log(`Listening on ${server.url}`);

‎packages/demo/getBestRoute/index.html‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<script type="module" src="./index.ts"></script>
7+
</head>
8+
</html>

packages/demo/demo.getBestRoute.ts renamed to packages/demo/getBestRoute/index.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import "./menu";
2-
import { createCanvas } from "./canvas";
1+
import "../utils/menu";
32
import { getBestRoute } from "@snk/solver/getBestRoute";
4-
import { Color, copyGrid } from "@snk/types/grid";
5-
import { grid, snake } from "./sample";
63
import { step } from "@snk/solver/step";
4+
import { Color, copyGrid } from "@snk/types/grid";
5+
import { createCanvas } from "../utils/canvas";
6+
import { grid, snake } from "../utils/sample";
77

88
const chain = getBestRoute(grid, snake)!;
99

‎packages/demo/getBestTunnel/index.html‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<script type="module" src="./index.ts"></script>
7+
</head>
8+
</html>

packages/demo/demo.getBestTunnel.ts renamed to packages/demo/getBestTunnel/index.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
import "./menu";
2-
import { createCanvas } from "./canvas";
3-
import { getSnakeLength } from "@snk/types/snake";
4-
import { grid, snake } from "./sample";
5-
import { getColor } from "@snk/types/grid";
1+
import "../utils/menu";
62
import { getBestTunnel } from "@snk/solver/getBestTunnel";
73
import { createOutside } from "@snk/solver/outside";
84
import type { Color } from "@snk/types/grid";
5+
import { getColor } from "@snk/types/grid";
96
import type { Point } from "@snk/types/point";
7+
import { getSnakeLength } from "@snk/types/snake";
8+
import { createCanvas } from "../utils/canvas";
9+
import { grid, snake } from "../utils/sample";
1010

1111
const { canvas, ctx, draw, highlightCell } = createCanvas(grid);
1212
document.body.appendChild(canvas);

‎packages/demo/getPathTo/index.html‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<script type="module" src="./index.ts"></script>
7+
</head>
8+
</html>

packages/demo/demo.getPathTo.ts renamed to packages/demo/getPathTo/index.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import "./menu";
2-
import { createCanvas } from "./canvas";
3-
import { copySnake, snakeToCells } from "@snk/types/snake";
4-
import { grid, snake as snake0 } from "./sample";
1+
import "../utils/menu";
52
import { getPathTo } from "@snk/solver/getPathTo";
3+
import { copySnake, snakeToCells } from "@snk/types/snake";
4+
import { createCanvas } from "../utils/canvas";
5+
import { grid, snake as snake0 } from "../utils/sample";
66

77
const { canvas, ctx, draw, getPointedCell, highlightCell } = createCanvas(grid);
88
canvas.style.pointerEvents = "auto";

0 commit comments

Comments
 (0)