Set up System module asset compilation with Mix

- Copied restructure from the "wip/inspector-rewrite" branch.
- Added manifest and vendor files in "{% snowboard %}" tag.
- Used standard Mix config path to auto-register the module.

Author: bennothommo

.github/workflows/code-quality.yaml

@@ -51,10 +51,10 @@ jobs:
         with:
             node-version: 12
 
-      - name: Install Node dependencies
-        working-directory: ./modules/system/assets/js/snowboard
+      - name: Install Node dependencies for System Module
+        working-directory: ./modules/system
         run: npm install
 
-      - name: Run code quality checks
-        working-directory: ./modules/system/assets/js/snowboard
+      - name: Run code quality checks on System Module
+        working-directory: ./modules/system
         run: npx eslint .

.vscode/settings.json

@@ -25,5 +25,9 @@
         "**/themes/*/layouts/*.htm": "wintercms",
         "**/themes/*/pages/**/*.htm": "wintercms",
         "**/themes/*/partials/**/*.htm": "wintercms"
-    }
+    },
+    "eslint.validate": [
+        "javascript",
+        "vue"
+    ]
 }

modules/cms/twig/SnowboardNode.php

@@ -43,18 +43,28 @@ public function compile(TwigCompiler $compiler)
 
         $moduleMap = [
             'base' => (Config::get('app.debug', false) === true) ? 'snowboard.base.debug' : 'snowboard.base',
+            'vendor' => 'snowboard.vendor',
             'request' => 'snowboard.request',
             'attr' => 'snowboard.data-attr',
             'extras' => 'snowboard.extras',
         ];
+        $manifestPath = Request::getBasePath() . '/modules/system/assets/js/build/manifest.js';
         $basePath = Request::getBasePath() . '/modules/system/assets/js/snowboard/build/';
 
         if (!static::$baseLoaded) {
+            // Add manifest and vendor files
+            $compiler
+                ->write("echo '<script data-module=\"snowboard-manifest\" src=\"${manifestPath}${cacheBust}\"></script>'.PHP_EOL;" . PHP_EOL);
+            $vendorJs = $moduleMap['vendor'];
+            $compiler
+                ->write("echo '<script data-module=\"snowboard-vendor\" src=\"${basePath}${vendorJs}.js${cacheBust}\"></script>'.PHP_EOL;" . PHP_EOL);
+
             // Add base script
             $baseJs = $moduleMap['base'];
             $baseUrl = Url::to('/');
             $compiler
                 ->write("echo '<script data-module=\"snowboard-base\" data-base-url=\"${baseUrl}\" src=\"${basePath}${baseJs}.js${cacheBust}\"></script>'.PHP_EOL;" . PHP_EOL);
+
             static::$baseLoaded = true;
         }
 

modules/system/.eslintignore

@@ -0,0 +1,11 @@
+# Ignore build files
+**/node_modules/**
+build/*.js
+**/build/*.js
+**/mix.webpack.js
+
+# Ignore all JS except for Mix-based assets
+assets/js
+!assets/js/snowboard
+assets/ui
+assets/vendor

modules/system/.eslintrc.json

@@ -0,0 +1,36 @@
+{
+    "env": {
+        "es6": true,
+        "browser": true
+    },
+    "globals": {
+        "Snowboard": "writable"
+    },
+    "extends": [
+        "airbnb-base",
+        "plugin:vue/vue3-recommended"
+    ],
+    "rules": {
+        "class-methods-use-this": ["off"],
+        "indent": ["error", 4, {
+            "SwitchCase": 1
+        }],
+        "max-len": ["off"],
+        "new-cap": ["error", { "properties": false }],
+        "no-alert": ["off"],
+        "no-param-reassign": ["error", {
+            "props": false
+        }],
+        "vue/html-indent": ["error", 4],
+        "vue/html-self-closing": ["error", {
+            "html": {
+                "void": "never",
+                "normal": "any",
+                "component": "always"
+            },
+            "svg": "always",
+            "math": "always"
+        }],
+        "vue/multi-word-component-names": ["off"]
+    }
+}

modules/system/.gitignore

@@ -0,0 +1,6 @@
+# System module ignores
+
+# Ignore Mix files
+node_modules
+package-lock.json
+mix.webpack.js

modules/system/ServiceProvider.php

@@ -568,10 +568,6 @@ protected function registerAssetBundles()
             $combiner->registerBundle('~/modules/system/assets/less/framework.extras.less');
             $combiner->registerBundle('~/modules/system/assets/less/snowboard.extras.less');
         });
-
-        MixAssets::registerCallback(function ($mix) {
-            $mix->registerPackage('snowboard', '~/modules/system/assets/js/snowboard/winter.mix.js');
-        });
     }
 
     /**