reorganized folders and added build function

jesseagleboy · jesseagleboy · commit 60c9364a77ae · 2025-03-12T17:03:54.000-04:00
diff --git a/build.ts b/build.ts
@@ -0,0 +1,16 @@
+import bunPluginTailwind from "bun-plugin-tailwind"
+import bunPluginSvelte from "bun-plugin-svelte"
+
+Bun.build({
+	entrypoints: ["src/index.html", "src/another-page.html"],
+	outdir: "./dist",
+	minify: true,
+	splitting: true,
+	sourcemap: "linked",
+	naming: {
+		entry: "[dir]/[name].[ext]", // Preserves original HTML names
+		chunk: "assets/[name]-[hash].[ext]", // Unique chunks with hashes
+		asset: "assets/[name]-[hash].[ext]", // Unique assets with hashes
+	},
+	plugins: [bunPluginTailwind, bunPluginSvelte],
+});
diff --git a/package.json b/package.json
@@ -1,6 +1,8 @@
 {
   "scripts": {
-    "dev": "bun **/*.html"
+    "dev": "bun src/**/*.html",
+    "build": "bun build.ts",
+    "preview": "bun run build; bunx serve dist"
   },
   "dependencies": {
     "@preact/signals-react": "^3.0.1",
diff --git a/src/another-page.html b/src/another-page.html
@@ -4,8 +4,8 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Another Page</title>
-    <link rel="stylesheet" href="./styles.css">
-    <script src="another.tsx" type="module" defer></script>
+    <link rel="stylesheet" href="stylesheet/styles.css">
+    <script src="./react/another.tsx" type="module" defer></script>
 </head>
 <body class="prose p-4">
     <h4>This is another page</h4>
diff --git a/src/index.html b/src/index.html
@@ -4,9 +4,9 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Bun Testing 1.2.3</title>
-    <script src="index.tsx" type="module" defer></script>
-    <script src="svelte.ts" type="module" defer></script>
-    <link rel="stylesheet" href="./styles.css">
+    <script src="./react/index.tsx" type="module" defer></script>
+    <script src="./svelte/svelte.ts" type="module" defer></script>
+    <link rel="stylesheet" href="stylesheet/styles.css">
 </head>
 <body class="prose p-4">
     <h3>This is a regular HTML setup</h3>
diff --git a/src/react/another.tsx b/src/react/another.tsx
@@ -1,5 +1,5 @@
 import {createRoot} from 'react-dom/client';
-import {count} from "./store";
+import {count} from "../store";
 
 function Another() {
     return (
diff --git a/src/react/index.tsx b/src/react/index.tsx
@@ -1,5 +1,5 @@
 import { createRoot } from "react-dom/client";
-import {count} from "./store";
+import {count} from "../store";
 function App() {
 	return (
 		<article className="p-1.5">
diff --git a/src/store.ts b/src/store.ts
diff --git a/src/stylesheet/styles.css b/src/stylesheet/styles.css
diff --git a/src/svelte/App.svelte b/src/svelte/App.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { count } from "./store.ts";
+	import { count } from "../store.ts";
 	// biome-ignore lint/style/useConst: <explanation>
 	let name = $state("Jesse");
 </script>
diff --git a/src/svelte/svelte.ts b/src/svelte/svelte.ts
