Improved build script

- Executing CLI utilities instead of deasync-ing
- Config file `webpage.json` (also replaces order.json)
- Removed Bash build scripts

archive.sh

@@ -1,2 +0,0 @@
-#!/usr/bin/env bash
-7z a built.zip dist/*

build.sh

@@ -1,100 +0,0 @@
-#!/usr/bin/env bash
-
-RED='\033[1;31m'
-GREEN='\033[1;32m'
-YELLOW='\033[1;33m'
-BLUE='\033[1;34m'
-BOLD='\033[1m'
-RESET='\033[0m'
-
-minjs="dist/script.min.js"
-mincss="dist/style.min.css"
-minhtml="dist/index.html"
-
-minjs_name="script.min.js"
-mincss_name="style.min.css"
-minhtml_name="index.html"
-
-title() {
-    echo
-    echo -e "${BLUE}[*]${RESET} $1"
-}
-
-start() {
-    echo
-    echo -e "${YELLOW}[+]${RESET} ${BOLD}Building web site in:${RESET}"
-    echo -e "${BOLD}$PWD${RESET}"
-}
-
-success() {
-    echo
-    echo -e "${GREEN}[V]${RESET} ${BOLD}Done${RESET}"
-    echo
-}
-
-check_deps() {
-    which "$1" >/dev/null 2>/dev/null
-    if [[ $? == 1 ]]; then
-        echo -e "${RED}[!]${RESET} $1 is required"
-        echo
-        exit 1
-    fi
-}
-
-js_minify() {
-    order=('js/anim.js' 'js/script.js' 'js/init.js' 'js/menu.js' 'js/control.js' 'js/handlers.js')
-    terser -o "$minjs" ${order[*]}
-}
-
-html_minify () {
-    html-minifier \
-        --collapse-boolean-attributes \
-        --collapse-inline-tag-whitespace \
-        --collapse-whitespace \
-        --remove-attribute-quotes \
-        --remove-comments \
-        --remove-script-type-attributes \
-        --remove-style-link-type-attributes \
-        --use-short-doctype \
-        -o "$minhtml" \
-        "$1"
-}
-
-copy_files() {
-    exclude=('\.$' '\.git' 'index.html' 'styles.less' 'js' 'dist' 'build.sh' 'html_conv' 'README.md')
-    items="${exclude[@]}"
-    regex="${items//[[:space:]]/|}"
-    find -maxdepth 1 -exec bash -c "if [[ {} =~ $regex ]]; then :; else cp -r {} dist/; fi" \;
-}
-
-start
-
-title "Creating dist/"
-mkdir -p dist/
-
-title "Checking dependencies"
-check_deps terser
-check_deps lessc
-check_deps cleancss
-check_deps html-minifier
-check_deps python3
-
-title "Minifying JS"
-js_minify
-
-title "Converting LESS"
-lessc "styles.less" "$mincss"
-
-title "Minifying CSS"
-cleancss -o "$mincss" "$mincss"
-
-title "Editing HTML"
-cat index.html | python3 html_conv.py "$minjs_name" "$mincss_name" >"$minhtml"
-
-title "Minifying HTML"
-html_minify "$minhtml"
-
-title "Copying other files"
-copy_files
-
-success

clean.sh

@@ -1,2 +0,0 @@
-#!/usr/bin/env bash
-rm -rf dist/ built.zip

dc09.js

@@ -1,10 +1,14 @@
 const fs = require('fs')
+const path = require('path')
+
 const cp = require('child_process')
 const process = require('process')
-const deasync = require('deasync')
-const exec = cp.execSync
+//const exec = cp.execSync
+const exec = (cmd) => {
+    console.log(`Exec: ${cmd}`)
+    return cp.execSync(cmd)
+}
 
-const less = require('less')
 const CleanCSS = require('clean-css')
 const html = require('html-minifier')
 
@@ -20,8 +24,6 @@ const reset = '\033[0m'
 
 const minjs   = 'script.min.js'
 const mincss  = 'style.min.css'
-const minhtml = 'index.html'
-const root = ['.domains']
 
 
 main()
@@ -61,96 +63,119 @@ function main() {
 
 function buildAll() {
     buildOne('.')
+    print('Completed', true, 'V', green)
 }
 
 function buildOne(dir) {
+
     print(`${bold}Building:${reset} ${dir}`)
     fs.mkdirSync(`dist/${dir}`, {recursive: true})
-    print('Minifying JS')
-    minifyJs(dir)
-    print('Rendering LESS')
-    renderLess(dir)
-    print('Minifying CSS')
-    minifyCss(dir)
-    print('Converting paths in HTML')
-    convertPathsHtml(dir)
-    print('Minifying HTML')
-    minifyHtml(dir)
-}
 
-function minifyJs(dir) {
-    const orderFile = `${dir}/js/order.json`
-    let order
-    if (fs.existsSync(orderFile)) {
-        order = JSON.parse(fs.readFileSync(orderFile))
+    const config = `${dir}/webpage.json`
+    let files
+    if (fs.existsSync(config)) {
+        files = JSON.parse(fs.readFileSync(config))
     }
     else {
         print(
-            'Unable to find order.json, skipping',
+            'Unable to find webpage.json, skipping',
             false, '!', yellow,
         )
         return
     }
+
+    print('Minifying JS')
+    minifyJs(dir, files)
+    print('Rendering LESS')
+    renderLess(dir, files)
+    print('Minifying CSS')
+    minifyCss(dir, files)
+    print('Converting paths in HTML')
+    convertPathsHtml(dir, files)
+    print('Minifying HTML')
+    minifyHtml(dir, files)
+}
+
+function minifyJs(dir, files) {
+    files.js = files.js || []
+    if (files.js.length == 0) return;
     exec(
-        `node_modules/.bin/terser -o "dist/${dir}/${minjs}" ` +
-        order.map(js => `"${dir}/js/${js}"`).join(' ')
+        'node_modules/.bin/terser --compress --mangle ' +
+        `-o "dist/${dir}/${minjs}" ` +
+        files.js.map(js => `"${dir}/${js}"`).join(' ')
     )
 }
 
-function renderLess(dir) {
-    const content = deasync(less.render)(
-        fs.readFileSync(`${dir}/styles.less`).toString()
-    )
-    fs.writeFileSync(
-        `dist/${dir}/${mincss}`,
-        content.css,
+function renderLess(dir, files) {
+    files.less = files.less || []
+    if (files.less.length == 0) return;
+    rendered = path.resolve(`dist/${dir}/${mincss}`)
+    exec(
+        'node_modules/.bin/lessc ' +
+        files.less.map(less => `"${dir}/${less}"`).join(' ') +
+        ` "${rendered}"`
     )
+    files.css = [
+        ...(files.css || []),
+        rendered,
+    ]
 }
 
-function minifyCss(dir) {
-    const renderedCss = `dist/${dir}/${mincss}`
-    const content = new CleanCSS().minify(
-        fs.readFileSync(renderedCss)
-    ).styles
-    fs.writeFileSync(renderedCss, content)
+function minifyCss(dir, files) {
+    files.css = files.css || []
+    if (files.css.length == 0) return;
+    const content = new CleanCSS().minify(files.css).styles
+    fs.writeFileSync(`dist/${dir}/${mincss}`, content)
 }
 
-function convertPathsHtml(dir) {
+function convertPathsHtml(dir, files) {
     const scriptRegex = /(?:<script src=['"]?js\/\w+\.js['"]?><\/script>[\s\r\n]*)+/gm
-    const content = fs.readFileSync(`${dir}/index.html`)
-        .toString()
-        .replace(
-            '<script src="https://cdn.jsdelivr.net/npm/less"></script>',
-            ''
-        )
-        .replace(
-            '<link rel="stylesheet/less" type="text/css" href="styles.less" />',
-            `<link rel="stylesheet" href="${mincss}" />`
-        )
-        .replace(
-            scriptRegex,
-            `<script src="${minjs}"></script>`
-        )
-    fs.writeFileSync(`dist/${dir}/${minhtml}`, content)
+    const converted = []
+    files.html = files.html || []
+    for (let file of files.html) {
+        const content = fs.readFileSync(`${dir}/${file}`)
+            .toString()
+            .replace(
+                '<script src="https://cdn.jsdelivr.net/npm/less"></script>',
+                ''
+            )
+            .replace(
+                '<link rel="stylesheet/less" type="text/css" href="styles.less" />',
+                `<link rel="stylesheet" href="${mincss}" />`
+            )
+            .replace(
+                scriptRegex,
+                `<script src="${minjs}"></script>`
+            )
+        const built = path.resolve(`dist/${dir}/${file}`)
+        fs.writeFileSync(built, content)
+        converted.push(built)
+    }
+    files.html = converted
 }
 
-function minifyHtml(dir) {
-    const convertedHtml = `dist/${dir}/${minhtml}`
-    const content = html.minify(
-        fs.readFileSync(convertedHtml).toString(),
-        {
-            collapseBooleanAttributes: true,
-            collapseInlineTagWhitespace: true,
-            collapseWhitespace: true,
-            removeAttributeQuotes: true,
-            removeComments: true,
-            removeScriptTypeAttributes: true,
-            removeStyleLinkTypeAttributes: true,
-            useShortDoctype: true,
-            keepClosingSlash: false,
-        }
-    )
-    fs.writeFileSync(convertedHtml, content)
+function minifyHtml(dir, files) {
+    files.html = files.html || []
+    for (let file of files.html) {
+        const isAbs = path.isAbsolute(file)
+        const name  = (isAbs ? file : `${dir}/${file}`)
+        const built = (isAbs ? file : `dist/${dir}/${file}`)
+        const content = html.minify(
+            fs.readFileSync(name).toString(),
+            {
+                collapseBooleanAttributes: true,
+                collapseInlineTagWhitespace: true,
+                collapseWhitespace: true,
+                removeAttributeQuotes: true,
+                removeComments: true,
+                removeScriptTypeAttributes: true,
+                removeStyleLinkTypeAttributes: true,
+                useShortDoctype: true,
+                keepClosingSlash: false,
+            }
+        )
+        fs.writeFileSync(built, content)
+    }
 }
 
 
@@ -159,7 +184,13 @@ function archive() {
 }
 
 function clean() {
-    exec('rm -rf dist/ dist.zip')
+    fs.rmSync('dist/', {
+        recursive: true,
+        force: true,
+    })
+    fs.rmSync('dist.zip', {
+        force: true,
+    })
 }
 
 

js/order.json

@@ -1,8 +0,0 @@
-[
-    "anim.js",
-    "script.js",
-    "init.js",
-    "menu.js",
-    "control.js",
-    "handlers.js"
-]

package.json

@@ -1,7 +1,6 @@
 {
   "dependencies": {
     "clean-css": "^5.3.1",
-    "deasync": "^0.1.28",
     "html-minifier": "^4.0.0",
     "less": "^4.1.3",
     "terser": "^5.16.1"

webpage.json

@@ -0,0 +1,17 @@
+{
+    "html": ["index.html"],
+    "less": ["styles.less"],
+    "css": [],
+    "js": [
+        "js/anim.js",
+        "js/script.js",
+        "js/init.js",
+        "js/menu.js",
+        "js/control.js",
+        "js/handlers.js"
+    ],
+    "files": [
+        "img/", "svg/", "fontawesome/",
+        ".domains"
+    ]
+}