refactor: build fronend via cli to allow watch mode

.devfiles/init-bun.ts

@@ -0,0 +1,3 @@
+import sassPlugin from "@alecodes/bun-plugin-sass";
+
+Bun.plugin(sassPlugin);

.justfile

@@ -3,6 +3,10 @@ mod repo ".devfiles/justfile"
 
 set dotenv-load := true
 
+set shell := ["zsh", "-uc"]
+
+build_mode := env("BUILD_MODE", "DEVELOPMENT")
+
 [private]
 docker-compose +ARGS:
   docker compose --file .devfiles/docker/docker-compose.dev.yaml --env-file .env --project-name compendium {{ARGS}}
@@ -17,24 +21,13 @@ migrate: (docker-compose "run dbmate migrate")
 rollback: (docker-compose "run dbmate rollback")
 
 build-frontend:
-  #!/usr/bin/env bun
+  bun build \
-  import sassPlugin from "@alecodes/bun-plugin-sass";
+    {{ if uppercase(build_mode) == "DEVELOPMENT" { "--watch" } else { "" } }} \
-
+    --outdir 'dist' \
-  const entrypoints = Array.from(
+    --public-path '/' \
-    new Bun.Glob("frontend/**/*.html").scanSync(".")
+    --entry-naming '[dir]/[name].[ext]' \
-  );
+    --chunk-naming 'assets/[name]-[hash].[ext]' \
-
+    --asset-naming 'assets/[name]-[hash].[ext]' \
-  const result = await Bun.build({
+    --splitting \
-    entrypoints,
+    --css-chunking \
-    outdir: "dist",
+    {{ './frontend/**/*.html' }}
-    publicPath: "/",
-    splitting: true,
-    plugins: [sassPlugin],
-    naming: {
-      entry: "[dir]/[name].[ext]",
-      chunk: "assets/[name]-[hash].[ext]",
-      asset: "assets/[name]-[hash].[ext]",
-    },
-  });
-
-  console.log("Assets compiled!");

bunfig.toml

@@ -1,3 +1,5 @@
+preload = ["./.devfiles/init-bun.ts"]
+
 [serve.static]
 plugins = ["bun-plugin-sass"]
 

frontend/css/style.css

@@ -1,3 +1,3 @@
 h1 {
-	color: red;
+	color: blue;
 }