leanweb 1.2.8 → 1.3.1

package/commands/build.js

@@ -1,5 +1,6 @@
 import fs from 'fs';
 import fse from 'fs-extra';
+import { minify } from 'html-minifier';
 import * as utils from './utils.js';
 import * as parser from '../lib/lw-html-parser.js';
 
@@ -88,7 +89,14 @@ const require = createRequire(import.meta.url);
                }
                const styleString = cssString || '';
                const htmlString = fs.readFileSync(htmlFilename, 'utf8');
-               const ast = parser.parse(htmlString);
+               const minifiedHtml = minify(htmlString, {
+                caseSensitive: true,
+                collapseWhitespace: true,
+                minifyCSS: true,
+                minifyJS: true,
+                removeComments: true,
+             });
+               const ast = parser.parse(minifiedHtml);
                ast.css = styleString;
                ast.componentFullName = project.name + '-' + cmp.replace(/\//g, '-');
                ast.runtimeVersion = project.version;

package/commands/dist.js

@@ -2,7 +2,6 @@ import webpack from 'webpack';
 import * as utils from './utils.js';
 import fs from 'fs';
 import fse from 'fs-extra';
-// const minify = require('html-minifier').minify;
 import { minify } from 'html-minifier';
 import CleanCSS from 'clean-css';
 
@@ -49,7 +48,7 @@ if (args.length >= 3) {
          collapseWhitespace: true,
          minifyCSS: true,
          minifyJS: true,
-         caseSensitive: true,
+         removeComments: true,
       });
       fs.writeFileSync(`./${utils.dirs.dist}/index.html`, minifiedIndexHtml);
 

package/commands/init.js

@@ -103,7 +103,8 @@ const require = createRequire(import.meta.url);
       });
       console.log('\nSome useful commands:');
       console.log('"lw s" to start the dev server.');
-      console.log('"lw d" to build for production. The output will be in dist/ directory.');
+      console.log('"lw di" to build for production. The output will be in dist/ directory.');
       console.log('"lw g my-new-component" to generate a new standard web component.');
+      console.log('"lw h" to get more help information.');
    }
 })();

package/package.json

@@ -1,6 +1,6 @@
 {
    "name": "leanweb",
-   "version": "1.2.8",
+   "version": "1.3.1",
    "description": "Builds framework agnostic web components.",
    "bin": {
       "leanweb": "leanweb.js",

package/templates/lib/lw-element.js

@@ -143,7 +143,6 @@ export default class LWElement extends HTMLElement {
                this._bindModels(rootNode);
                this._bindEvents(rootNode);
                this._bindInputs(rootNode);
-               rootNode.removeAttribute('lw-elem-bind');
             }
             if (rootNode.hasAttribute('lw-if')) {
                this.updateIf(rootNode);
@@ -162,11 +161,17 @@ export default class LWElement extends HTMLElement {
       const treeWalker = document.createTreeWalker(rootNode, NodeFilter.SHOW_ELEMENT, {
          acceptNode: node => {
             if (node.hasAttribute('lw-elem')) {
+               if (node.hasAttribute('lw-for')) {
+                  this.updateFor(node);
+                  return NodeFilter.FILTER_REJECT;
+               }
+               if (node.hasAttribute('lw-for-parent')) {
+                  return NodeFilter.FILTER_REJECT;
+               }
                if (node.hasAttribute('lw-elem-bind')) {
                   this._bindModels(node);
                   this._bindEvents(node);
                   this._bindInputs(node);
-                  node.removeAttribute('lw-elem-bind');
                }
                if (node.hasAttribute('lw-if')) {
                   this.updateIf(node);
@@ -174,13 +179,6 @@ export default class LWElement extends HTMLElement {
                if (node.hasAttribute('lw-false')) {
                   return NodeFilter.FILTER_REJECT;
                }
-               if (node.hasAttribute('lw-for-parent')) {
-                  return NodeFilter.FILTER_REJECT;
-               }
-               if (node.hasAttribute('lw-for')) {
-                  this.updateFor(node);
-                  return NodeFilter.FILTER_REJECT;
-               }
                this.updateEval(node);
                this.updateClass(node);
                this.updateBind(node);
@@ -203,6 +201,10 @@ export default class LWElement extends HTMLElement {
    }
 
    _bindInputs(inputNode) {
+      if (inputNode['lw_input_bound']) {
+         return;
+      }
+      inputNode['lw_input_bound'] = true;
       for (const attr of inputNode.attributes) {
          const attrName = attr.name;
          const attrValue = attr.value;
@@ -218,17 +220,17 @@ export default class LWElement extends HTMLElement {
    }
 
    // properties:
-   // lw-on:click: true
+   // lw_event_bound: boolean
    _bindEvents(eventNode) {
+      if (eventNode['lw_event_bound']) {
+         return;
+      }
+      eventNode['lw_event_bound'] = true;
       const me = this;
       for (const attr of eventNode.attributes) {
          const attrName = attr.name;
          const attrValue = attr.value;
          if (attrName.startsWith('lw-on:')) {
-            if (eventNode[attrName]) {
-               continue;
-            }
-            eventNode[attrName] = true;
             const interpolation = this.ast[attrValue];
             interpolation.lwValue.split(',').forEach(eventType => {
                eventNode.addEventListener(eventType.trim(), (event => {
@@ -250,16 +252,16 @@ export default class LWElement extends HTMLElement {
    }
 
    // properties:
-   // model_event_bound: boolean
+   // lw_model_bound: boolean
    _bindModels(modelNode) {
       const key = modelNode.getAttribute('lw-model');
       if (!key) {
          return;
       }
-      if (modelNode['model_event_bound']) {
+      if (modelNode['lw_model_bound']) {
          return;
       }
-      modelNode['model_event_bound'] = true;
+      modelNode['lw_model_bound'] = true;
       const interpolation = this.ast[key];
       modelNode.addEventListener('input', (event => {
          const context = this._getNodeContext(modelNode);