Update notification + add built time + add nvmrc

.nvmrc

@@ -0,0 +1 @@
+v14.15.1

assets/scripts/modules/Load.js

@@ -7,7 +7,7 @@ export default class extends module {
     }
 
     init() {
-        
+
         const load = new modularLoad({
             enterDelay: 0,
             transitions: {

build/notification.js

@@ -0,0 +1,8 @@
+import notifier from 'node-notifier';
+
+export default function notification({title, message}) {
+    notifier.notify({
+        title: title,
+        message: message
+    });
+}

build/scripts.js

@@ -1,16 +1,29 @@
 import esbuild from 'esbuild';
 import paths from '../mconfig.json';
 import message from './utils/message.js';
+import notification from './notification.js';
 
 export function buildScripts() {
-    message('Compiling JS...', 'waiting');
+    console.time('JS built in');
 
-    esbuild.buildSync({
+    esbuild.build({
         entryPoints: [paths.scripts.src + paths.scripts.main + '.js'],
         bundle: true,
         minify: true,
         sourcemap: true,
+        color: true,
+        logLevel: 'error',
+        errorLimit: 1,
         target: ['es2015'],
         outfile: paths.scripts.dest + paths.scripts.main + '.js'
-    });
+    }).catch((e) => {
+        // errors managments (already done in esbuild)
+        notification({
+            title: 'Javascript built failed 🚨',
+            message: `${e.errors[0].text} in ${e.errors[0].location.file} line ${e.errors[0].location.line}`
+        });
+    }).then(() => {
+        message('Javascript built','success', 'JS built in')
+    })
+
 }

build/styles.js

@@ -5,6 +5,7 @@ import fs from 'fs';
 import message from './utils/message.js';
 
 export function compileStyles() {
+    console.time('Styles built in');
 
     // Compile main scss
     sass.render({
@@ -13,12 +14,12 @@ export function compileStyles() {
         outputStyle: 'compressed',
         sourceMap: true
     }, (error, result) => {
-        
+
         if(error) {
-            message('Error compile main.scss', 'error');
+            message('Error compiling main.scss', 'error');
             console.log(error);
         } else {
-            message('main.scss compiled', 'success');
+            message('Styles built', 'success', 'Styles built in');
         }
 
         if(!error){
@@ -26,6 +27,9 @@ export function compileStyles() {
             fs.writeFile(paths.styles.dest + paths.styles.main + '.css', result.css, (err) => {});
           }
     });
+
+    console.time('Critical style built in');
+
     // Compile critical scss
     sass.render({
         file: paths.styles.src + paths.styles.critical + '.scss',
@@ -33,12 +37,12 @@ export function compileStyles() {
         outputStyle: 'compressed',
         sourceMap: true
     }, (error, result) => {
-        
+
         if(error) {
-            message('Error compile critical.scss', 'error');
+            message('Error compiling critical.scss', 'error');
             console.log(error);
         } else {
-            message('critical.scss compiled', 'success');
+            message('Critical style built', 'success', 'Critical style built in');
         }
 
         if(!error){
@@ -46,4 +50,4 @@ export function compileStyles() {
             fs.writeFile(paths.styles.dest + paths.styles.critical + '.css', result.css, (err) => {});
           }
     });
-}
+}

build/svgs.js

@@ -3,10 +3,14 @@ import paths from '../mconfig.json';
 import message from './utils/message.js';
 
 export function generateSpriteSVG() {
+
+    console.time('Sprite generated in');
+
     // Write sprite content on disk
     mixer([paths.svgs.src + '*.svg'], {spriteConfig: { usages: false }})
     .then((result) => {
-        message('SVG Sprite generated', 'success');
+        result.write(paths.svgs.dest + 'sprite.svg');
-        result.write(paths.svgs.dest + 'sprite.svg')
+        message('SVG Sprite generated', 'success', 'Sprite generated in');
+
     });
-}
+}

build/utils/message.js

@@ -1,14 +1,23 @@
 
-// colors reference  : https://coderwall.com/p/yphywg/printing-colorful-text-in-terminal-when-run-node-js-script
+import kleur from 'kleur';
-export default function message(text, type) {
+
-    
+export default function message(text, type, timerId) {
+
     if(type === 'success') {
-        console.log(`\x1b[42m \x1b[30m`, `✅ ${text}`, `\x1b[0m`);
+        console.log(kleur.bgGreen().black(` ✅ ${text} `));
+
+        if(timerId !== undefined) {
+            console.timeEnd(timerId)
+        }
     } else if (type === 'error') {
-        console.log(`\x1b[41m \x1b[37m`,`🚨 ${text}`, `\x1b[0m`);
+        console.log(kleur.bgRed(` 🚨 ${text} `));
+
     } else if (type === 'waiting') {
-        console.log(`\x1b[43m \x1b[30m`,`⏱  ${text}`, `\x1b[0m`);
+
+        console.log(kleur.blue().italic(` ⏱  ${text} `));
     } else {
-        console.log(text);   
+        console.log(text);
     }
-}
+
+    console.log('');
+}

package-lock.json

@@ -3059,6 +3059,12 @@
       "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.15.tgz",
       "integrity": "sha512-6uHUhOPEBgQ24HM+r6b/QwWfZq+yiFcipKFrOFiBEnWdy5sdzYoi+pJeQaPI5qOLRFqWmAXUPQNsielzdLoecA=="
     },
+    "growly": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
+      "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE=",
+      "dev": true
+    },
     "gulp": {
       "version": "4.0.2",
       "resolved": "https://registry.npmjs.org/gulp/-/gulp-4.0.2.tgz",
@@ -3433,6 +3439,12 @@
         }
       }
     },
+    "is-docker": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/is-docker/-/is-docker-2.1.1.tgz",
+      "integrity": "sha512-ZOoqiXfEwtGknTiuDEy8pN2CfE3TxMHprvNer1mXiqwkOT77Rw3YVrUQ52EqAOU3QAWDQ+bQdx7HJzrv7LS2Hw==",
+      "dev": true
+    },
     "is-extendable": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
@@ -3666,6 +3678,12 @@
       "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.2.tgz",
       "integrity": "sha512-s5kLOcnH0XqDO+FvuaLX8DDjZ18CGFk7VygH40QoKPUQhW4e2rvM0rwUq0t8IQDOwYSeLK01U90OjzBTme2QqA=="
     },
+    "kleur": {
+      "version": "4.1.3",
+      "resolved": "https://registry.npmjs.org/kleur/-/kleur-4.1.3.tgz",
+      "integrity": "sha512-H1tr8QP2PxFTNwAFM74Mui2b6ovcY9FoxJefgrwxY+OCJcq01k5nvhf4M/KnizzrJvLRap5STUy7dgDV35iUBw==",
+      "dev": true
+    },
     "last-run": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/last-run/-/last-run-1.1.1.tgz",
@@ -4226,6 +4244,64 @@
         }
       }
     },
+    "node-notifier": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-8.0.0.tgz",
+      "integrity": "sha512-46z7DUmcjoYdaWyXouuFNNfUo6eFa94t23c53c+lG/9Cvauk4a98rAUp9672X5dxGdQmLpPzTxzu8f/OeEPaFA==",
+      "dev": true,
+      "requires": {
+        "growly": "^1.3.0",
+        "is-wsl": "^2.2.0",
+        "semver": "^7.3.2",
+        "shellwords": "^0.1.1",
+        "uuid": "^8.3.0",
+        "which": "^2.0.2"
+      },
+      "dependencies": {
+        "is-wsl": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-2.2.0.tgz",
+          "integrity": "sha512-fKzAra0rGJUUBwGBgNkHZuToZcn+TtXHpeCgmkMJMMYx1sQDYaCSyjJBSCa2nH1DGm7s3n1oBnohoVTBaN7Lww==",
+          "dev": true,
+          "requires": {
+            "is-docker": "^2.0.0"
+          }
+        },
+        "lru-cache": {
+          "version": "6.0.0",
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+          "dev": true,
+          "requires": {
+            "yallist": "^4.0.0"
+          }
+        },
+        "semver": {
+          "version": "7.3.4",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.4.tgz",
+          "integrity": "sha512-tCfb2WLjqFAtXn4KEdxIhalnRtoKFN7nAwj0B3ZXCbQloV2tq5eDbcTmT68JJD3nRJq24/XgxtQKFIpQdtvmVw==",
+          "dev": true,
+          "requires": {
+            "lru-cache": "^6.0.0"
+          }
+        },
+        "uuid": {
+          "version": "8.3.2",
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
+          "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
+          "dev": true
+        },
+        "which": {
+          "version": "2.0.2",
+          "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
+          "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
+          "dev": true,
+          "requires": {
+            "isexe": "^2.0.0"
+          }
+        }
+      }
+    },
     "node-sass": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-5.0.0.tgz",
@@ -5447,6 +5523,12 @@
       "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
       "dev": true
     },
+    "shellwords": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.1.tgz",
+      "integrity": "sha512-vFwSUfQvqybiICwZY5+DAWIPLKsWO31Q91JSKl3UYv+K5c2QRPzn0qzec6QPu1Qc9eHYItiP3NdJqNVqetYAww==",
+      "dev": true
+    },
     "sigmund": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz",

package.json

@@ -3,11 +3,12 @@
   "name": "@locomotivemtl/boilerplate",
   "title": "Locomotive Boilerplate",
   "version": "1.0.0",
+  "engines": { "node": "???" },
   "type": "module",
   "author": "Locomotive <info@locomotive.ca>",
   "scripts": {
-    "start": "node --experimental-json-modules build/watch.js",
+    "start": "node --experimental-json-modules --no-warnings build/watch.js",
-    "build": "node --experimental-json-modules build/build.js"
+    "build": "node --experimental-json-modules --no-warnings build/build.js"
   },
   "dependencies": {
     "locomotive-scroll": "*",
@@ -21,6 +22,8 @@
     "concat": "^1.0.3",
     "esbuild": "^0.8.16",
     "fs": "0.0.1-security",
+    "kleur": "^4.1.3",
+    "node-notifier": "^8.0.0",
     "node-sass": "^5.0.0",
     "svg-mixer": "^2.3.14"
   }