@agung_dhewe/webapps 1.2.3 → 1.2.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agung_dhewe/webapps",
-  "version": "1.2.3",
+  "version": "1.2.4",
   "description": "library javascript (nodejs+express) untuk pengembangan applikasi web",
   "type": "module",
   "main": "./src/webapps.js",

package/src/generator/createTable.js

@@ -23,9 +23,6 @@ export async function createTable(context, options) {
 			return
 		}
 
-		console.log(context.entities)
-
-
 
 		// start geneate program code		
 		let sections = []

package/src/generator/templates/__rollup-module copy.ejs

@@ -0,0 +1,90 @@
+/************************************************************************
+ * minimize script using rollup
+ * 
+ * you need to install rollup & terser to use this tools
+ *
+ * usage:
+ * npx rollup -c ./public/modules/<%=moduleName%>/__rollup.<%=moduleName%>.js
+ *
+ * This module is generated by fgta5 generator
+ ************************************************************************/
+
+ 
+import terser from '@rollup/plugin-terser';
+import { writeFileSync } from 'fs';
+import { readFile, unlink, access } from 'fs/promises';
+import { join } from 'path';
+import { constants } from 'fs';
+
+const currentdate = (new Date()).toISOString().split('T')[0]
+const banner = `<%=moduleName%>
+*
+* build at ${currentdate}
+`
+
+const filename = `version.txt`;
+const filepath = join('public/modules/<%=moduleName%>', filename);
+
+/* Hapus versi sebelumnya */
+if (await isExists(filepath)) {
+	const previousVersionNumber = await readFile(filepath, 'utf8');
+	const previousFile = `public/modules/<%=moduleName%>/<%=moduleName%>-${previousVersionNumber}.min.mjs`
+	await unlink(previousFile);
+}
+
+/* Create New Version */
+const newVersionNumber = getTimestampYYMMDDHHII()
+
+
+// Simpan ke file
+writeFileSync(filepath, newVersionNumber, 'utf8')
+
+
+export default {
+	input: "public/modules/<%=moduleName%>/<%=moduleName%>.mjs", // File utama yang menjadi entry point
+	output: {
+		file: `public/modules/<%=moduleName%>/<%=moduleName%>-${newVersionNumber}.min.mjs`, // Lokasi output file hasil bundle
+		format: "esm", // Format modul ECMAScript
+		banner: `/*! ${banner}*/`,
+		// manualChunks: (id) => {
+		// 	console.log('Chunking:', id);
+		// 	if (id.includes('module.mjs')  || id.includes('-ext.mjs') || id.includes('public/libs/webmodule')) return null;
+		// }
+	},
+	external: (id) => {
+ 		return id.includes('module.mjs') || id === '$fgta5' || id.includes('public/libs/webmodule');
+	},
+	
+	preserveEntrySignatures: 'strict',
+
+    plugins: [
+		terser({
+			compress: {
+				pure_funcs: ['console.log', 'console.warn'] // hanya log dan warn dihilangkan, sedangkan error tidak
+				// drop_console: true // hapus console
+			}
+		})
+	]
+}
+
+
+function getTimestampYYMMDDHHII() {
+	const now = new Date();
+	const yy = String(now.getFullYear()).slice(-2);
+	const mm = String(now.getMonth() + 1).padStart(2, '0');
+	const dd = String(now.getDate()).padStart(2, '0');
+	const hh = String(now.getHours()).padStart(2, '0');
+	const ii = String(now.getMinutes()).padStart(2, '0');
+	return `${yy}${mm}${dd}${hh}${ii}`;
+};
+
+
+async function isExists(filepath) {
+	try {
+		await access(filepath, constants.F_OK);
+		return true
+	} catch {
+		return false
+	}
+
+}

package/src/generator/templates/__rollup-module.ejs

@@ -11,61 +11,108 @@
 
  
 import terser from '@rollup/plugin-terser';
+import postcss from 'rollup-plugin-postcss';
+import cssnano from 'cssnano';
+import atImport from 'postcss-import';
+import del from 'rollup-plugin-delete';
+
 import { writeFileSync } from 'fs';
 import { readFile, unlink, access } from 'fs/promises';
 import { join } from 'path';
 import { constants } from 'fs';
 
+
+const moduleName = '<%=moduleName%>'
+const moduleDirPath = `public/modules/${moduleName}`
+const filename = `version.txt`;
+const filepath = join(moduleDirPath, filename);
+
 const currentdate = (new Date()).toISOString().split('T')[0]
-const banner = `<%=moduleName%>
+const banner = `${moduleName}
 *
 * build at ${currentdate}
 `
 
-const filename = `version.txt`;
-const filepath = join('public/modules/<%=moduleName%>', filename);
+
 
 /* Hapus versi sebelumnya */
 if (await isExists(filepath)) {
 	const previousVersionNumber = await readFile(filepath, 'utf8');
-	const previousFile = `public/modules/<%=moduleName%>/<%=moduleName%>-${previousVersionNumber}.min.mjs`
-	await unlink(previousFile);
+	const previousMjsFile = join(moduleDirPath, `${moduleName}-${previousVersionNumber}.min.mjs`)
+	const previousCssFile = join(moduleDirPath, `${moduleName}-${previousVersionNumber}.min.css`)
+
+	await Promise.all([
+		remove(previousMjsFile),
+		remove(previousCssFile)
+	])
 }
 
+const cssFiles = await getCssFiles()
+
+
 /* Create New Version */
 const newVersionNumber = getTimestampYYMMDDHHII()
 
 
+
 // Simpan ke file
 writeFileSync(filepath, newVersionNumber, 'utf8')
 
 
-export default {
-	input: "public/modules/<%=moduleName%>/<%=moduleName%>.mjs", // File utama yang menjadi entry point
-	output: {
-		file: `public/modules/<%=moduleName%>/<%=moduleName%>-${newVersionNumber}.min.mjs`, // Lokasi output file hasil bundle
-		format: "esm", // Format modul ECMAScript
-		banner: `/*! ${banner}*/`,
-		// manualChunks: (id) => {
-		// 	console.log('Chunking:', id);
-		// 	if (id.includes('module.mjs')  || id.includes('-ext.mjs') || id.includes('public/libs/webmodule')) return null;
-		// }
-	},
-	external: (id) => {
- 		return id.includes('module.mjs') || id === '$fgta5' || id.includes('public/libs/webmodule');
+export default [
+	{
+		input: join(moduleDirPath, `${moduleName}.mjs`), // File utama yang menjadi entry point
+		output: {
+			file: join(moduleDirPath, `${moduleName}-${newVersionNumber}.min.mjs`), // Lokasi output file hasil bundle
+			format: "esm", // Format modul ECMAScript
+			banner: `/*! ${banner}*/`,
+		},
+		external: (id) => {
+			return id.includes('module.mjs') || id === '$fgta5' || id.includes('public/libs/webmodule');
+		},
+
+		preserveEntrySignatures: 'strict',
+
+		plugins: [
+			terser({
+				compress: {
+					pure_funcs: ['console.log', 'console.warn'] // hanya log dan warn dihilangkan, sedangkan error tidak
+					// drop_console: true // hapus console
+				}
+			})
+		]
 	},
-	
-	preserveEntrySignatures: 'strict',
-
-    plugins: [
-		terser({
-			compress: {
-				pure_funcs: ['console.log', 'console.warn'] // hanya log dan warn dihilangkan, sedangkan error tidak
-				// drop_console: true // hapus console
-			}
-		})
-	]
-}
+
+	{
+		input: cssFiles,
+		output: {
+			dir: moduleDirPath
+		},
+		plugins: [
+
+			// Konfigurasi PostCSS untuk CSS
+			postcss({
+				extract: `${moduleName}-${newVersionNumber}.min.css`, // Nama file output CSS
+				minimize: true, // Aktifkan minifikasi
+				plugins: [
+					atImport(), // 1. Gabungkan semua @import menjadi satu file
+					cssnano() // Plugin untuk optimasi CSS
+				]
+			}),
+			del({
+				targets: [
+					join(moduleDirPath, `${moduleName}.js`),
+					join(moduleDirPath, `${moduleName}.layout.js`),
+				],
+				hook: 'closeBundle' // Jalankan setelah semua proses selesai
+			})
+		]
+	}
+
+]
+
+
+
 
 
 function getTimestampYYMMDDHHII() {
@@ -79,6 +126,30 @@ function getTimestampYYMMDDHHII() {
 };
 
 
+async function remove(filepath) {
+	if (await isExists(filepath)) {
+		await unlink(filepath)
+	}
+}
+
+
+async function getCssFiles() {
+	const cssFiles = []
+	const cssMainFile = join(moduleDirPath, `${moduleName}.css`)
+	const cssLayoutFile = join(moduleDirPath, `${moduleName}.layout.css`)
+
+	if (await isExists(cssMainFile)) {
+		cssFiles.push(cssMainFile)
+	}
+
+	if (await isExists(cssLayoutFile)) {
+		cssFiles.push(cssLayoutFile)
+	}
+
+	return cssFiles;
+}
+
+
 async function isExists(filepath) {
 	try {
 		await access(filepath, constants.F_OK);

package/src/routers/modulePage.js

@@ -33,22 +33,30 @@ export async function modulePage(req, res) {
 
 
 	// const mjsFileName = appDebugMode ? `${moduleName}.mjs` : `${moduleName}.min.mjs`
+	let useCssBundle
+	let cssBundleFileName
 	let mjsFileName
 	if (appDebugMode) {
 		// Default Debug
 		if (req.query.mode == 'release') {
 			const version = await getCurrentVersion(path.join(__rootDir, 'public', 'modules', moduleName, 'version.txt'))
 			mjsFileName = `${moduleName}-${version}.min.mjs`
+			cssBundleFileName = `${moduleName}-${version}.min.css`
+			useCssBundle = true
 		} else {
 			mjsFileName = `${moduleName}.mjs`
+			useCssBundle = false
 		}
 	} else {
 		// Default Production
 		if (req.query.mode == 'debug') {
 			mjsFileName = `${moduleName}.mjs`
+			useCssBundle = false
 		} else {
 			const version = await getCurrentVersion(path.join(__rootDir, 'public', 'modules', moduleName, 'version.txt'))
 			mjsFileName = `${moduleName}-${version}.min.mjs`
+			cssBundleFileName = `${moduleName}-${version}.min.css`
+			useCssBundle = true
 		}
 	}
 	const mjsPath = path.join(__rootDir, 'public', 'modules', moduleName, mjsFileName);
@@ -113,7 +121,9 @@ export async function modulePage(req, res) {
 				additionalHeaderExists,
 				cssApplicationPath,
 				cssApplicationExists,
-				setting: req.app.locals.appConfig
+				setting: req.app.locals.appConfig,
+				useCssBundle,
+				cssBundleFileName,
 			}
 		}
 

package/templates/application.page.ejs

@@ -30,15 +30,17 @@
 		<% } %>
 
 
-		<% if (cssExists) { %>
-		<link rel="stylesheet" href="public/modules/<%= `${moduleName}/${moduleName}.css` %>" />
-		<% } %>
-
-		<% if (cssLayoutExists) { %>
-		<link rel="stylesheet" href="public/modules/<%= `${moduleName}/${moduleName}.layout.css` %>" />
-		<% } %>
+		<% if (useCssBundle) { %>
+			<link rel="stylesheet" href="public/modules/<%= `${moduleName}/${cssBundleFileName}` %>" />
+		<% } else { %> 
+			<% if (cssExists) { %>
+			<link rel="stylesheet" href="public/modules/<%= `${moduleName}/${moduleName}.css` %>" />
+			<% } %>
 
-		
+			<% if (cssLayoutExists) { %>
+			<link rel="stylesheet" href="public/modules/<%= `${moduleName}/${moduleName}.layout.css` %>" />
+			<% } %>
+		<% } %>	
 
 		<style>
 			#loadingindicator {