Using a bundler

.github/workflows/main.yml

@@ -32,7 +32,7 @@ jobs:
           readme: https://github.com/${{github.repository}}/raw/main/README.md
 
       # Create a zip file with all files required by the module to add to the release
-      - run: zip -r ./module.zip module.json LICENSE languages/ modules/ styles/build/theme-glass.css
+      - run: zip -r ./module.zip module.json LICENSE languages/ build/
 
       # Create a release for this specific version
       - name: Update Release with Files

gulpfile.js

@@ -0,0 +1,58 @@
+const gulp = require("gulp");
+const compiler = require("webpack");
+const webpack = require("webpack-stream");
+const named = require("vinyl-named");
+const postcss = require("gulp-postcss");
+
+/* ----------------------------------------- */
+/*  Compile CSS
+/* ----------------------------------------- */
+
+const SYSTEM_SCSS = ["styles/**/*.css"];
+/**
+ * Compile CSS
+ * @returns {object}
+ */
+function compileCss() {
+  return gulp.src("styles/theme-glass.css").pipe(postcss()).pipe(gulp.dest("./build"));
+}
+const css = gulp.series(compileCss);
+
+/* ----------------------------------------- */
+/*  Compile Javascript
+/* ----------------------------------------- */
+
+const SYSTEM_JS = ["modules/**/*.js"];
+/**
+ * Compile JS
+ * @returns {object}
+ */
+function compileJs() {
+  return gulp
+    .src(["modules/theme-glass.js"])
+    .pipe(named())
+    .pipe(webpack({ mode: "production" }, compiler))
+    .pipe(gulp.dest("./build"));
+}
+const js = gulp.series(compileJs);
+
+/* ----------------------------------------- */
+/*  Watch Updates
+/* ----------------------------------------- */
+
+/**
+ * Watch modifications
+ */
+function watchUpdates() {
+  gulp.watch(SYSTEM_SCSS, css);
+  gulp.watch(SYSTEM_JS, js);
+}
+
+/* ----------------------------------------- */
+/*  Export Tasks
+/* ----------------------------------------- */
+
+exports.default = gulp.series(compileCss, compileJs, watchUpdates);
+exports.build = gulp.series(compileCss, compileJs);
+exports.css = css;
+exports.js = js;

module.json

@@ -19,12 +19,12 @@
   "conflicts": [],
   "socket": true,
   "scripts": [],
-  "esmodules": ["./modules/module.js"],
-  "styles": ["styles/build/theme-glass.css"],
+  "esmodules": ["./build/theme-glass.js"],
+  "styles": ["./build/theme-glass.css"],
   "flags": {
     "hotReload": {
       "extensions": ["css"],
-      "paths": ["styles/build/theme-glass.css"]
+      "paths": ["build/theme-glass.css"]
     }
   },
   "languages": [