Merge pull request #280 from hhio618/development

add css/js bundles
ubiquity · Aug 20, 2024 · 92f0e61 · 92f0e61
2 parents 9d3950a + 78469d4
commit 92f0e61
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 8 deletions.
diff --git a/.gitignore b/.gitignore
@@ -12,6 +12,7 @@ commit.txt
 .pnp.loader.mjs
 .env
 static/dist
+static/bundles
 
 cypress/screenshots
 cypress/videos

diff --git a/build/esbuild-build.ts b/build/esbuild-build.ts
@@ -17,10 +17,26 @@ export const esBuildContext: esbuild.BuildOptions = {
     ".ttf": "dataurl",
     ".svg": "dataurl",
   },
-  outdir: "static/out",
+  outfile: "static/bundles/bundles.js",
+  entryNames: "bundles", // Ensure the CSS is named bundles.css
   define: createEnvDefines(["SUPABASE_URL", "SUPABASE_ANON_KEY"], {
     commitHash: execSync(`git rev-parse --short HEAD`).toString().trim(),
   }),
+  plugins: [
+    {
+      name: "css-bundle",
+      setup(build) {
+        build.onEnd((result) => {
+          execSync(`cat static/styles/rewards/pay.css > static/bundles/bundles.css`);
+          execSync(`cat static/styles/rewards/background.css >> static/bundles/bundles.css`);
+          execSync(`cat static/styles/toast.css >> static/bundles/bundles.css`);
+          execSync(`cat static/styles/rewards/claim-table.css >> static/bundles/bundles.css`);
+          execSync(`cat static/styles/rewards/media-queries.css >> static/bundles/bundles.css`);
+          execSync(`cat static/styles/rewards/light-mode.css >> static/bundles/bundles.css`);
+        });
+      },
+    },
+  ],
 };
 
 esbuild

diff --git a/static/index.html b/static/index.html
@@ -2,12 +2,7 @@
 <html>
   <head>
     <link rel="icon" href="favicon.svg" type="image/x-icon" />
-    <link href="styles/rewards/pay.css" rel="stylesheet" />
-    <link href="styles/rewards/background.css" rel="stylesheet" />
-    <link href="styles/toast.css" rel="stylesheet" />
-    <link href="styles/rewards/claim-table.css" rel="stylesheet" />
-    <link href="styles/rewards/media-queries.css" rel="stylesheet" />
-    <link href="styles/rewards/light-mode.css" rel="stylesheet" />
+    <link href="bundles/bundles.css" rel="stylesheet" />
     <link rel="canonical" href="https://pay.ubq.fi" />
     <meta charset="utf-8" />
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
@@ -196,7 +191,7 @@
       </footer>
     </main>
     <ul class="notifications"></ul>
-    <script src="out/init.js" type="application/javascript"></script>
     <link href="styles/proxima.css" rel="stylesheet" />
+    <script src="bundles/bundles.js" type="application/javascript"></script>
   </body>
 </html>