The build tools update! (#5)

* fxupdater fix/change, added ability for local builds with .zip output

* Added option for unzip local release

* Added pretty logs

.gitignore

@@ -28,4 +28,7 @@ ui/*.suo
 ui/*.ntvs*
 ui/*.njsproj
 ui/*.sln
-ui/*.sw?
+ui/*.sw?
+
+temp
+releases

README.md

@@ -47,13 +47,32 @@ yarn run serve
 
 ### Run in Production (compiles and minifies for production)
 
-- Prior to pushing to your repo
-- Run build to update the FX Manifest for produciton
+#### Local Build/Release
+
+- Run build:local to update the FX Manifest and build/zip your project for production release. 
+- The release version is determined by the version number within `/ui/package.json`
+- This will output your production build of the script as a .zip file within `/releases/version/yourscript.zip`
 
 ```bash
-yarn build
+yarn run build:local
 ```
 
+> or if you want to have the release build without being zipped, run
+
+```bash
+yarn run build:local:unzip
+```
+
+#### Github Auto Build/Release
+> This allows your project to automatically build and release your UI/project to a github release whenever someone pushes to your main branch (This is HIGHLY recommended for any open source scripts)
+
+- Prior to pushing to your repo
+- Run build to update the FX Manifest for production
+
+```bash
+yarn run build
+```
+##### Auto Build setup
 - Open release.yml (.github/workflows)
 - Modify line 26 (files) to include all of your static files
   - folders are denoted by its name without an extension
@@ -76,6 +95,6 @@ yarn build
 
 ### Lints and fixes files
 
-```
+```bash
 yarn run lint
 ```

fxmanifest.lua

@@ -1,11 +1,11 @@
-fx_version 'adamant'
+fx_version 'cerulean'
 rdr3_warning 'I acknowledge that this is a prerelease build of RedM, and I am aware my resources *will* become incompatible once RedM ships.'
 
 game 'rdr3'
 lua54 'yes'
 
 
-author 'Bytesizd'
+author 'BCC Scripts'
 description 'Redm, NUI, Vuejs boilerplate'
 
 client_script {
@@ -19,7 +19,9 @@ ui_page {
 files {
     "ui/index.html",
     "ui/js/*.*",
-    "ui/css/*.*"
+    "ui/css/*.*",
+    "ui/fonts/*.*",
+    "ui/img/*.*"
 }
 
 version '1.0.0'

ui/build/fxupdate.js

@@ -1,15 +1,33 @@
-var fs = require('fs')
+var fs = require('fs');
+var colors = require('colors');
+colors.enable()
+
 fs.readFile('../fxmanifest.lua', 'utf8', function (err, data) {
     if (err) throw err;
 
+    console.info('>'.blue, 'Updating fxmanifest file...')
+
+    let expr = /files \{([^}]*)\}/g
+    let replace = 
+`files {
+    "ui/index.html",
+    "ui/js/*.*",
+    "ui/css/*.*",
+    "ui/fonts/*.*",
+    "ui/img/*.*"
+}`
+
     if (process.env.NODE_ENV === 'development') {
-        data = data.replaceAll("ui/index.html", "ui/shim.html")
-    } else {
-        data = data.replaceAll("ui/shim.html", "ui/index.html")
+        replace = 
+`files {
+    "ui/shim.html"
+}`
     }
 
+    data = data.replaceAll(expr, replace)
+
     fs.writeFile ('../fxmanifest.lua', data, function(err) {
         if (err) throw err;
-        console.log('fxmanifest file updated');
+        console.info('fxmanifest file updated!'.green);
     });
 });

ui/build/local.js

@@ -0,0 +1,55 @@
+var fs = require('fs');
+var path = require('path');
+var archiver = require('archiver');
+var colors = require('colors');
+colors.enable()
+
+var { version } = require('../package.json')
+
+function zipDirectory(sourceDir, outFolder, outPath) {
+    const archive = archiver('zip', { zlib: { level: 9 }});
+
+    fs.mkdirSync(outFolder, { recursive: true });
+    const stream = fs.createWriteStream(`${outFolder}/${outPath}`);
+
+    return new Promise((resolve, reject) => {
+      archive
+        .directory(sourceDir, false)
+        .on('error', err => reject(err))
+        .pipe(stream)
+      ;
+
+      stream.on('close', () => resolve());
+      archive.finalize();
+    });
+}
+
+(async () => {
+    console.info(">".blue, "Cloning project into release...")
+    fs.readdirSync('../').forEach(path => {
+        if (path !== 'ui' && path !=='releases') {
+            fs.cpSync(`../${path}`, `../temp/${path}`, {recursive: true});
+        }
+    })
+
+    console.info(">".blue, "Cloning UI build into release...");
+    fs.cpSync('./dist', '../temp/ui', {recursive: true});
+
+    let name = path.basename(path.resolve('../'));
+    let output_file = `releases/${version}/${name}`
+
+    if (process.env.ZIP === 'true') {
+        console.info(">".blue, "Creating your release zip...");
+        await zipDirectory('../temp', `../releases/${version}`, `${name}.zip`);
+        output_file = output_file+'.zip';
+    } else {
+        console.info(">".blue, "Creating your release file...");
+        fs.cpSync('../temp', `../${output_file}`, {recursive: true});
+    }
+
+    console.info(">".blue, "Cleaning up temp build folders...");
+    fs.rmSync('../temp', {force: true, recursive: true});
+    fs.rmSync('./dist', {force: true, recursive: true});
+
+    console.info(`Release is done!`.green, `${output_file}`.underline.yellow);
+})()

ui/package.json

@@ -5,8 +5,11 @@
   "scripts": {
     "serve": "NODE_ENV=development yarn run shim && vue-cli-service serve",
     "build": "NODE_ENV=production yarn run shim && vue-cli-service build",
+    "build:local": "NODE_ENV=local yarn run shim && vue-cli-service build && ZIP=true yarn run local",
+    "build:local:unzip": "NODE_ENV=local yarn run shim && vue-cli-service build && yarn run local",
     "lint": "vue-cli-service lint",
-    "shim": "node build/fxupdate.js"
+    "shim": "node build/fxupdate.js",
+    "local": "node build/local.js"
   },
   "dependencies": {
     "autoprefixer": "^10",
@@ -26,6 +29,8 @@
     "@vue/cli-plugin-router": "~5.0.0",
     "@vue/cli-plugin-vuex": "~5.0.0",
     "@vue/cli-service": "~5.0.0",
+    "archiver": "^7.0.0",
+    "colors": "^1.4.0",
     "eslint": "^7.32.0",
     "eslint-plugin-vue": "^8.0.3",
     "sass": "^1.32.7",