Add JS/CSS build script (hestiacp#3471)

Author: AlecRust

build.js

@@ -0,0 +1,83 @@
+// Build JS and CSS using esbuild and PostCSS
+const esbuild = require('esbuild');
+const postcss = require('postcss');
+const fs = require('fs').promises;
+const path = require('path');
+const postcssConfig = require('./postcss.config.js');
+
+// Esbuild JavaScript configuration
+const esbuildConfig = {
+	outdir: './web/js/dist',
+	entryNames: '[dir]/[name].min',
+	minify: true,
+};
+
+// Build JavaScript
+async function buildJS() {
+	const jsSrcPath = './web/js/src/';
+	const jsEntries = await fs.readdir(jsSrcPath);
+	const jsBuildPromises = jsEntries
+		.filter((entry) => path.extname(entry) === '.js')
+		.map((entry) => {
+			const inputPath = path.join(jsSrcPath, entry);
+			return esbuild
+				.build({
+					...esbuildConfig,
+					entryPoints: [inputPath],
+				})
+				.then(() => {
+					console.log('✅ JavaScript build completed for', inputPath);
+				});
+		});
+
+	try {
+		await Promise.all(jsBuildPromises);
+	} catch (error) {
+		console.error('❌ Error building JavaScript:', error);
+		process.exit(1);
+	}
+}
+
+// Process and build CSS
+async function processCSS(inputFile, outputFile) {
+	try {
+		const css = await fs.readFile(inputFile);
+		const result = await postcss(postcssConfig.plugins).process(css, {
+			from: inputFile,
+			to: outputFile,
+		});
+		await fs.writeFile(outputFile, result.css);
+		console.log(`✅ CSS build completed for ${inputFile}`);
+	} catch (error) {
+		console.error(`❌ Error processing CSS for ${inputFile}:`, error);
+		process.exit(1);
+	}
+}
+
+// Build CSS files
+async function buildCSS() {
+	const themesSrcPath = './web/css/src/themes/';
+	const cssEntries = await fs.readdir(themesSrcPath);
+
+	const cssBuildPromises = cssEntries
+		.filter((entry) => path.extname(entry) === '.css')
+		.map(async (entry) => {
+			const entryName = entry.replace('.css', '.min.css');
+			const inputPath = path.join(themesSrcPath, entry);
+			const outputPath = `./web/css/themes/${entryName}`;
+			await processCSS(inputPath, outputPath);
+		});
+
+	await Promise.all(cssBuildPromises);
+}
+
+// Build all assets
+async function build() {
+	console.log('🚀 Building JS and CSS...');
+	await buildJS();
+	await buildCSS();
+	console.log('🎉 Build completed.');
+}
+
+// Execute build
+build();

package.json

@@ -9,7 +9,7 @@
 		"docs:dev": "vitepress dev docs",
 		"docs:build": "vitepress build docs",
 		"docs:serve": "vitepress serve docs",
-		"build": "postcss web/css/src/themes/*.css --dir web/css/themes --ext .min.css",
+		"build": "node build.js",
 		"lint": "prettier --cache --check . && eslint --cache . && stylelint web/css/src/**/*.css && markdownlint-cli2 *.md docs/**/*.md",
 		"lint-staged": "lint-staged",
 		"format": "prettier --cache --write .",
@@ -26,14 +26,14 @@
 		"@typescript-eslint/eslint-plugin": "^5.58.0",
 		"@typescript-eslint/parser": "^5.58.0",
 		"cssnano": "^6.0.0",
+		"esbuild": "^0.17.16",
 		"eslint": "^8.38.0",
 		"eslint-config-prettier": "^8.8.0",
 		"eslint-plugin-editorconfig": "^4.0.2",
 		"husky": "^8.0.3",
 		"lint-staged": "^13.2.1",
 		"markdownlint-cli2": "^0.6.0",
-		"postcss": "^8.4.21",
-		"postcss-cli": "^10.1.0",
+		"postcss": "^8.4.22",
 		"postcss-import": "^15.1.0",
 		"postcss-path-replace": "^1.0.4",
 		"postcss-preset-env": "^8.3.1",
@@ -42,10 +42,13 @@
 		"prettier-plugin-nginx": "^1.0.3",
 		"prettier-plugin-sh": "^0.12.8",
 		"prettier-plugin-sql": "^0.14.0",
-		"stylelint": "^15.4.0",
-		"stylelint-config-standard": "^32.0.0",
+		"stylelint": "^15.5.0",
+		"stylelint-config-standard": "^33.0.0",
 		"typescript": "^5.0.4",
-		"vitepress": "1.0.0-alpha.65",
+		"vitepress": "1.0.0-alpha.70",
 		"vue": "^3.2.47"
-	}
+	},
+	"browserslist": [
+		"defaults"
+	]
 }