Initial commit to github

bin/.build.js

@@ -0,0 +1,24 @@
+require("dotenv").config();
+
+const fs = require("fs");
+const path = require("path");
+const distDir = path.resolve(`static/dist`);
+const { tailwindToCSS } = require(`./.utils`);
+const start = performance.now();
+
+// Tailwind to CSS
+try {
+  // Ensure the output directory exists
+  if (!fs.existsSync(distDir)) {
+    fs.mkdirSync(distDir, { recursive: true });
+  }
+
+  // Compile Tailwind
+  tailwindToCSS();
+
+  const end = performance.now();
+  const runtime = (end - start).toFixed(3);
+  console.log(`Production build successfully run in ${runtime}ms`);
+} catch (error) {
+  console.error("Error processing CSS files:", error);
+}

bin/.utils.js

@@ -0,0 +1,25 @@
+/**
+ * Utility functions shared between builds
+ */
+
+const fs = require("fs");
+const path = require("path");
+const distDir = path.resolve(`static/dist`);
+const debounce = require("lodash.debounce");
+
+require("dotenv").config();
+
+// Theme root as working directory
+const cwd = path.resolve("..");
+
+// Compile Tailwind
+module.exports.tailwindToCSS = debounce(() => {
+  try {
+    require("child_process").execSync(
+      `npx @tailwindcss/cli -i styles/theme.css -o static/dist/theme.css`,
+      { stdio: "inherit" }
+    );
+  } catch (error) {
+    console.log(`Error compiling Tailwind to CSS:`, error);
+  }
+}, 50);

bin/.watch.js

@@ -0,0 +1,48 @@
+require("dotenv").config();
+
+const fs = require("fs");
+const path = require("path");
+const browserSync = require("browser-sync").create();
+const { tailwindToCSS } = require(`./.utils`);
+
+// Theme root as working directory
+const cwd = path.resolve("../");
+
+// Initialize BrowserSync
+browserSync.init({
+  proxy: process.env.LOCALHOST_URL,
+  port: process.env.BROWSERSYNC_PORT,
+  cors: true,
+  cwd: cwd,
+  logLevel: `warn`,
+  minify: false,
+  open: false,
+  ui: false,
+  ghostMode: false,
+  reloadOnRestart: true,
+  notify: false,
+  watch: true,
+});
+
+// Reload JS during development
+browserSync.watch(`static/js/*.js`, (event, file) => {
+  if (event !== "change") return;
+
+  const start = performance.now();
+  try {
+    browserSync.stream();
+    const end = performance.now();
+    const runtime = (end - start).toFixed(3);
+    console.log(`JS re-injected successfully in ${runtime}ms`);
+  } catch (error) {
+    console.log("Error compiling JS:", error);
+  }
+});
+
+// Compile tailwind to css and reload on changes
+browserSync.watch(["styles/**/*.css", "**/*.php"], (event, file) => {
+  if (event !== "change") return;
+
+  tailwindToCSS();
+  browserSync.reload();
+});