🐞 fix: Update build script

.vscode/settings.json

@@ -3,6 +3,14 @@
     "tree.indentGuidesStroke": "#3d92ec",
     "activityBar.background": "#213309",
     "titleBar.activeBackground": "#2E470C",
-    "titleBar.activeForeground": "#F6FCEE"
+    "titleBar.activeForeground": "#F6FCEE",
+    "titleBar.inactiveBackground": "#213209",
+    "titleBar.inactiveForeground": "#F7FCEF",
+    "statusBar.background": "#213209",
+    "statusBar.foreground": "#F7FCEF",
+    "statusBar.debuggingBackground": "#213209",
+    "statusBar.debuggingForeground": "#F7FCEF",
+    "statusBar.noFolderBackground": "#213209",
+    "statusBar.noFolderForeground": "#F7FCEF"
   }
 }

bin/.build.js

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

bin/.utils.js

@@ -14,12 +14,12 @@ const cwd = path.resolve("..");
 
 // Compile Tailwind
 module.exports.tailwindToCSS = debounce(() => {
-  try {
+    try {
-    require("child_process").execSync(
+        require("child_process").execSync(
-      `npx @tailwindcss/cli -i styles/theme.css -o static/dist/theme.css`,
+            `./node_modules/.bin/tailwindcss -i styles/theme.css -o static/dist/theme.css`,
-      { stdio: "inherit" }
+            { stdio: "inherit" }
-    );
+        );
-  } catch (error) {
+    } catch (error) {
-    console.log(`Error compiling Tailwind to CSS:`, error);
+        console.log(`Error compiling Tailwind to CSS:`, error);
-  }
+    }
 }, 50);

bin/.watch.js

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

package.json

@@ -1,42 +1,42 @@
 {
-  "name": "vdi-starter-v5",
+    "name": "vdi-starter-v5",
-  "version": "5.0",
+    "version": "5.0",
-  "description": "VDI-Starter-v5 is a minimal WordPress theme designed as a starting point for custom theme development. It focuses on modern development approaches with a lean architecture that avoids the overhead of theme frameworks.",
+    "description": "VDI-Starter-v5 is a minimal WordPress theme designed as a starting point for custom theme development. It focuses on modern development approaches with a lean architecture that avoids the overhead of theme frameworks.",
-  "scripts": {
+    "scripts": {
-    "start": "npm run watch",
+        "start": "npm run watch",
-    "watch": "node bin/.watch.js",
+        "watch": "node bin/.watch.js",
-    "build": "npx @tailwindcss/cli -i ./styles/theme.css -o ./static/dist/theme.css --optimize"
+        "build": "./node_modules/.bin/tailwindcss -i ./styles/theme.css -o ./static/dist/theme.css --optimize"
-  },
+    },
-  "repository": {
+    "repository": {
-    "type": "git",
+        "type": "git",
-    "url": "git+https://github.com/Vincent-Design-Inc/VDI-Starter-v5.git"
+        "url": "git+https://github.com/Vincent-Design-Inc/VDI-Starter-v5.git"
-  },
+    },
-  "keywords": [
+    "keywords": [
-    "wordpress",
+        "wordpress",
-    "minimal",
+        "minimal",
-    "basic",
+        "basic",
-    "custom",
+        "custom",
-    "theme"
+        "theme"
-  ],
+    ],
-  "author": "Keith Solomon <keith@vincentdesign.ca>",
+    "author": "Keith Solomon <keith@vincentdesign.ca>",
-  "license": "MIT",
+    "license": "MIT",
-  "bugs": {
+    "bugs": {
-    "url": "https://github.com/Vincent-Design-Inc/VDI-Starter-v5/issues"
+        "url": "https://github.com/Vincent-Design-Inc/VDI-Starter-v5/issues"
-  },
+    },
-  "homepage": "https://github.com/Vincent-Design-Inc/VDI-Starter-v5#readme",
+    "homepage": "https://github.com/Vincent-Design-Inc/VDI-Starter-v5#readme",
-  "devDependencies": {
+    "devDependencies": {
-    "@axe-core/playwright": "^4.10.1",
+        "@axe-core/playwright": "^4.10.1",
-    "@playwright/test": "^1.52.0",
+        "@playwright/test": "^1.52.0",
-    "@types/node": "^22.15.2",
+        "@types/node": "^22.15.2",
-    "browser-sync": "^3.0.3",
+        "browser-sync": "^3.0.3",
-    "dotenv": "^16.4.7"
+        "dotenv": "^16.4.7"
-  },
+    },
-  "dependencies": {
+    "dependencies": {
-    "@tailwindcss/cli": "^4.0.13",
+        "tailwindcss": "^4.0.13",
-    "@tailwindcss/typography": "^0.5.16",
+        "@tailwindcss/cli": "^4.0.13",
-    "glob": "^10.3.10",
+        "@tailwindcss/typography": "^0.5.16",
-    "lodash": "^4.17.21",
+        "glob": "^10.3.10",
-    "lodash.debounce": "^4.0.8",
+        "lodash": "^4.17.21",
-    "tailwindcss": "^4.0.13"
+        "lodash.debounce": "^4.0.8"
-  }
+    }
 }