htmlnano 2.0.4 → 2.1.0

package/docs/package.json

@@ -18,6 +18,7 @@
     "@mdx-js/react": "^1.6.21",
     "@svgr/webpack": "^6.5.1",
     "clsx": "^1.1.1",
+    "docusaurus-plugin-goatcounter": "^2.0.1",
     "file-loader": "^6.2.0",
     "prism-react-renderer": "^1.2.1",
     "react": "^17.0.1",

package/docs/versioned_docs/version-1.1.1/040-presets.md

@@ -3,9 +3,9 @@
 A preset is just an object with modules config.
 
 Currently the following presets are available:
-- [safe](https://github.com/posthtml/htmlnano/blob/master/lib/presets/safe.es6) — a default preset for minifying a regular HTML in a safe way (without breaking anything)
-- [ampSafe](https://github.com/posthtml/htmlnano/blob/master/lib/presets/ampSafe.es6) - same as `safe` preset but for [AMP pages](https://www.ampproject.org/)
-- [max](https://github.com/posthtml/htmlnano/blob/master/lib/presets/max.es6) - maximal minification (might break some pages)
+- [safe](https://github.com/posthtml/htmlnano/blob/master/lib/presets/safe.mjs) — a default preset for minifying a regular HTML in a safe way (without breaking anything)
+- [ampSafe](https://github.com/posthtml/htmlnano/blob/master/lib/presets/ampSafe.mjs) - same as `safe` preset but for [AMP pages](https://www.ampproject.org/)
+- [max](https://github.com/posthtml/htmlnano/blob/master/lib/presets/max.mjs) - maximal minification (might break some pages)
 
 
 You can use them the following way:
@@ -26,7 +26,7 @@ htmlnano
     });
 ```
 
-If you skip `preset` argument [`safe`](https://github.com/posthtml/htmlnano/blob/master/lib/presets/safe.es6) preset would be used by default.
+If you skip `preset` argument [`safe`](https://github.com/posthtml/htmlnano/blob/master/lib/presets/safe.mjs) preset would be used by default.
 
 
 If you'd like to define your very own config without any presets pass an empty object as a preset:

package/docs/versioned_docs/version-1.1.1/050-modules.md

@@ -144,7 +144,7 @@ Minified:
 
 
 ### removeEmptyAttributes
-Removes empty [safe-to-remove](https://github.com/posthtml/htmlnano/blob/master/lib/modules/removeEmptyAttributes.es6) attributes.
+Removes empty [safe-to-remove](https://github.com/posthtml/htmlnano/blob/master/lib/modules/removeEmptyAttributes.mjs) attributes.
 
 #### Side effects
 This module could break your styles or JS if you use selectors with attributes:
@@ -783,4 +783,3 @@ Minified:
 ```html
 <form method="get"></form>
 ```
-

package/docs/versioned_docs/version-1.1.1/060-contribute.md

@@ -2,7 +2,7 @@
 
 Since the minifier is modular, it's very easy to add new modules:
 
-1. Create a ES6-file inside `lib/modules/` with a function that does some minification. For example you can check [`lib/modules/example.es6`](https://github.com/posthtml/htmlnano/blob/master/lib/modules/example.es6).
+1. Create a ES6-file inside `lib/modules/` with a function that does some minification. For example you can check [`lib/modules/example.mjs`](https://github.com/posthtml/htmlnano/blob/master/lib/modules/example.mjs).
 
 2. Add the module's name into one of those [presets](https://github.com/posthtml/htmlnano/tree/master/lib/presets). You can choose either `ampSafe`, `max`, or `safe`.
 

package/docs/versioned_docs/version-2.0.0/040-presets.md

@@ -3,9 +3,9 @@
 A preset is just an object with modules config.
 
 Currently the following presets are available:
-- [safe](https://github.com/posthtml/htmlnano/blob/master/lib/presets/safe.es6) — a default preset for minifying a regular HTML in a safe way (without breaking anything)
-- [ampSafe](https://github.com/posthtml/htmlnano/blob/master/lib/presets/ampSafe.es6) - same as `safe` preset but for [AMP pages](https://www.ampproject.org/)
-- [max](https://github.com/posthtml/htmlnano/blob/master/lib/presets/max.es6) - maximal minification (might break some pages)
+- [safe](https://github.com/posthtml/htmlnano/blob/master/lib/presets/safe.mjs) — a default preset for minifying a regular HTML in a safe way (without breaking anything)
+- [ampSafe](https://github.com/posthtml/htmlnano/blob/master/lib/presets/ampSafe.mjs) - same as `safe` preset but for [AMP pages](https://www.ampproject.org/)
+- [max](https://github.com/posthtml/htmlnano/blob/master/lib/presets/max.mjs) - maximal minification (might break some pages)
 
 
 You can use them the following way:
@@ -26,7 +26,7 @@ htmlnano
     });
 ```
 
-If you skip `preset` argument [`safe`](https://github.com/posthtml/htmlnano/blob/master/lib/presets/safe.es6) preset would be used by default.
+If you skip `preset` argument [`safe`](https://github.com/posthtml/htmlnano/blob/master/lib/presets/safe.mjs) preset would be used by default.
 
 
 If you'd like to define your very own config without any presets pass an empty object as a preset:

package/docs/versioned_docs/version-2.0.0/050-modules.md

@@ -144,7 +144,7 @@ Minified:
 
 
 ### removeEmptyAttributes
-Removes empty [safe-to-remove](https://github.com/posthtml/htmlnano/blob/master/lib/modules/removeEmptyAttributes.es6) attributes.
+Removes empty [safe-to-remove](https://github.com/posthtml/htmlnano/blob/master/lib/modules/removeEmptyAttributes.mjs) attributes.
 
 #### Side effects
 This module could break your styles or JS if you use selectors with attributes:

package/docs/versioned_docs/version-2.0.0/060-contribute.md

@@ -2,7 +2,7 @@
 
 Since the minifier is modular, it's very easy to add new modules:
 
-1. Create a ES6-file inside `lib/modules/` with a function that does some minification. For example you can check [`lib/modules/example.es6`](https://github.com/posthtml/htmlnano/blob/master/lib/modules/example.es6).
+1. Create a ES6-file inside `lib/modules/` with a function that does some minification. For example you can check [`lib/modules/example.mjs`](https://github.com/posthtml/htmlnano/blob/master/lib/modules/example.mjs).
 
 2. Add the module's name into one of those [presets](https://github.com/posthtml/htmlnano/tree/master/lib/presets). You can choose either `ampSafe`, `max`, or `safe`.
 

package/index.cjs

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+const htmlnano = require("./lib/htmlnano.cjs").default;
+exports.default = htmlnano;
+
+// for backward compatibility with require('htmlnano')
+module.exports = htmlnano;

package/index.d.cts

@@ -0,0 +1,3 @@
+export type * from './index.d';
+import htmlnano from './index.d';
+export default htmlnano;

package/index.d.mts

@@ -0,0 +1,3 @@
+export type * from './index.d';
+import htmlnano from './index.d';
+export default htmlnano;

package/index.d.ts

@@ -1,7 +1,7 @@
 import type PostHTML from "posthtml";
-import type terser from "terser";
+import type { MinifyOptions } from "terser";
 import type { Options as CssNanoOptions } from "cssnano";
-import type { OptimizeOptions as SvgoOptimizeOptions } from "svgo";
+import type { Config as SvgoOptimizeOptions } from "svgo";
 
 export interface HtmlnanoOptions {
   skipConfigLoading?: boolean;
@@ -17,7 +17,7 @@ export interface HtmlnanoOptions {
   mergeScripts?: boolean;
   minifyCss?: CssNanoOptions | boolean;
   minifyConditionalComments?: boolean;
-  minifyJs?: terser.FormatOptions | boolean;
+  minifyJs?: MinifyOptions | boolean;
   minifyJson?: boolean;
   minifySvg?: SvgoOptimizeOptions | boolean;
   normalizeAttributeValues?: boolean;

package/index.mjs

@@ -0,0 +1,2 @@
+import htmlnano from './lib/htmlnano.mjs';
+export default htmlnano;

package/lib/helpers.cjs

@@ -0,0 +1,78 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.extractCssFromStyleNode = extractCssFromStyleNode;
+exports.isAmpBoilerplate = isAmpBoilerplate;
+exports.isComment = isComment;
+exports.isConditionalComment = isConditionalComment;
+exports.isEventHandler = isEventHandler;
+exports.isStyleNode = isStyleNode;
+exports.optionalImport = optionalImport;
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function __transformExtension(filepath, extMapping) {
+  if (!filepath.startsWith('./') && !filepath.startsWith('../')) {
+    // Package import
+    return filepath;
+  }
+  const idx = filepath.lastIndexOf('.');
+  if (idx === -1 || filepath.includes('/', idx)) {
+    // No extension
+    const newExt = extMapping[''];
+    if (newExt) {
+      return filepath + newExt;
+    }
+    return filepath;
+  }
+  for (let [origExt, newExt] of Object.entries(extMapping).sort((a, b) => b[0].length - a[0].length)) {
+    if (filepath.endsWith(origExt)) {
+      return filepath.slice(0, -origExt.length) + newExt;
+    }
+  }
+  return filepath;
+}
+const ampBoilerplateAttributes = ['amp-boilerplate', 'amp4ads-boilerplate', 'amp4email-boilerplate'];
+function isAmpBoilerplate(node) {
+  if (!node.attrs) {
+    return false;
+  }
+  for (const attr of ampBoilerplateAttributes) {
+    if (attr in node.attrs) {
+      return true;
+    }
+  }
+  return false;
+}
+function isComment(content) {
+  if (typeof content === 'string') {
+    return content.trim().startsWith('<!--');
+  }
+  return false;
+}
+function isConditionalComment(content) {
+  return (content || '').trim().startsWith('<!--[if');
+}
+function isStyleNode(node) {
+  return node.tag === 'style' && !isAmpBoilerplate(node) && 'content' in node && node.content.length > 0;
+}
+function extractCssFromStyleNode(node) {
+  return Array.isArray(node.content) ? node.content.join(' ') : node.content;
+}
+function isEventHandler(attributeName) {
+  return attributeName && attributeName.slice && attributeName.slice(0, 2).toLowerCase() === 'on' && attributeName.length >= 5;
+}
+async function optionalImport(moduleName) {
+  try {
+    const module = await (specifier => new Promise(r => r(`${specifier}`)).then(s => _interopRequireWildcard(require(s))))(__transformExtension(moduleName, {
+      ".mjs": ".cjs"
+    }));
+    return module.default || module;
+  } catch (e) {
+    if (e.code === 'MODULE_NOT_FOUND' || e.code === 'ERR_MODULE_NOT_FOUND') {
+      return null;
+    }
+    throw e;
+  }
+}

package/lib/helpers.mjs

@@ -0,0 +1,52 @@
+const ampBoilerplateAttributes = [
+    'amp-boilerplate',
+    'amp4ads-boilerplate',
+    'amp4email-boilerplate'
+];
+
+export function isAmpBoilerplate(node) {
+    if (!node.attrs) {
+        return false;
+    }
+    for (const attr of ampBoilerplateAttributes) {
+        if (attr in node.attrs) {
+            return true;
+        }
+    }
+    return false;
+}
+
+export function isComment(content) {
+    if (typeof content === 'string') {
+        return content.trim().startsWith('<!--');
+    }
+    return false;
+}
+
+export function isConditionalComment(content) {
+    return (content || '').trim().startsWith('<!--[if');
+}
+
+export function isStyleNode(node) {
+    return node.tag === 'style' && !isAmpBoilerplate(node) && 'content' in node && node.content.length > 0;
+}
+
+export function extractCssFromStyleNode(node) {
+    return Array.isArray(node.content) ? node.content.join(' ') : node.content;
+}
+
+export function isEventHandler(attributeName) {
+    return attributeName && attributeName.slice && attributeName.slice(0, 2).toLowerCase() === 'on' && attributeName.length >= 5;
+}
+
+export async function optionalImport(moduleName) {
+    try {
+        const module = await import(moduleName);
+        return module.default || module;
+    } catch (e) {
+        if (e.code === 'MODULE_NOT_FOUND' || e.code === 'ERR_MODULE_NOT_FOUND') {
+            return null;
+        }
+        throw e;
+    }
+}

package/lib/htmlnano.cjs

@@ -0,0 +1,200 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+exports.loadConfig = loadConfig;
+var _posthtml = _interopRequireDefault(require("posthtml"));
+var _cosmiconfig = require("cosmiconfig");
+var _safe = _interopRequireDefault(require("./presets/safe.cjs"));
+var _ampSafe = _interopRequireDefault(require("./presets/ampSafe.cjs"));
+var _max = _interopRequireDefault(require("./presets/max.cjs"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function __transformExtension(filepath, extMapping) {
+  if (!filepath.startsWith('./') && !filepath.startsWith('../')) {
+    // Package import
+    return filepath;
+  }
+  const idx = filepath.lastIndexOf('.');
+  if (idx === -1 || filepath.includes('/', idx)) {
+    // No extension
+    const newExt = extMapping[''];
+    if (newExt) {
+      return filepath + newExt;
+    }
+    return filepath;
+  }
+  for (let [origExt, newExt] of Object.entries(extMapping).sort((a, b) => b[0].length - a[0].length)) {
+    if (filepath.endsWith(origExt)) {
+      return filepath.slice(0, -origExt.length) + newExt;
+    }
+  }
+  return filepath;
+}
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const presets = {
+  safe: _safe.default,
+  ampSafe: _ampSafe.default,
+  max: _max.default
+};
+function loadConfig(options, preset, configPath) {
+  let {
+    skipConfigLoading = false,
+    ...rest
+  } = options || {};
+  if (!skipConfigLoading) {
+    const explorer = (0, _cosmiconfig.cosmiconfigSync)('htmlnano');
+    const rc = configPath ? explorer.load(configPath) : explorer.search();
+    if (rc) {
+      const {
+        preset: presetName
+      } = rc.config;
+      if (presetName) {
+        if (!preset && presets[presetName]) {
+          preset = presets[presetName];
+        }
+        delete rc.config.preset;
+      }
+      if (!options) {
+        rest = rc.config;
+      }
+    }
+  }
+  return [rest || {}, preset || _safe.default];
+}
+const optionalDependencies = {
+  minifyCss: ['cssnano', 'postcss'],
+  minifyJs: ['terser'],
+  minifyUrl: ['relateurl', 'srcset', 'terser'],
+  minifySvg: ['svgo']
+};
+const modules = {
+  collapseAttributeWhitespace: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/collapseAttributeWhitespace.cjs"))),
+  collapseBooleanAttributes: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/collapseBooleanAttributes.cjs"))),
+  collapseWhitespace: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/collapseWhitespace.cjs"))),
+  custom: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/custom.cjs"))),
+  deduplicateAttributeValues: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/deduplicateAttributeValues.cjs"))),
+  example: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/example.cjs"))),
+  mergeScripts: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/mergeScripts.cjs"))),
+  mergeStyles: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/mergeStyles.cjs"))),
+  minifyConditionalComments: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/minifyConditionalComments.cjs"))),
+  minifyCss: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/minifyCss.cjs"))),
+  minifyJs: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/minifyJs.cjs"))),
+  minifyJson: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/minifyJson.cjs"))),
+  minifySvg: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/minifySvg.cjs"))),
+  minifyUrls: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/minifyUrls.cjs"))),
+  normalizeAttributeValues: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/normalizeAttributeValues.cjs"))),
+  removeAttributeQuotes: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/removeAttributeQuotes.cjs"))),
+  removeComments: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/removeComments.cjs"))),
+  removeEmptyAttributes: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/removeEmptyAttributes.cjs"))),
+  removeOptionalTags: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/removeOptionalTags.cjs"))),
+  removeRedundantAttributes: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/removeRedundantAttributes.cjs"))),
+  removeUnusedCss: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/removeUnusedCss.cjs"))),
+  sortAttributes: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/sortAttributes.cjs"))),
+  sortAttributesWithLists: () => Promise.resolve().then(() => _interopRequireWildcard(require("./modules/sortAttributesWithLists.cjs")))
+};
+function htmlnano(optionsRun, presetRun) {
+  let [options, preset] = loadConfig(optionsRun, presetRun);
+  return async function minifier(tree) {
+    const nodeHandlers = [];
+    const attrsHandlers = [];
+    const contentsHandlers = [];
+    options = {
+      ...preset,
+      ...options
+    };
+    let promise = Promise.resolve(tree);
+    for (const [moduleName, moduleOptions] of Object.entries(options)) {
+      if (!moduleOptions) {
+        // The module is disabled
+        continue;
+      }
+      if (_safe.default[moduleName] === undefined) {
+        throw new Error('Module "' + moduleName + '" is not defined');
+      }
+      (optionalDependencies[moduleName] || []).forEach(async dependency => {
+        try {
+          await (specifier => new Promise(r => r(`${specifier}`)).then(s => _interopRequireWildcard(require(s))))(__transformExtension(dependency, {
+            ".mjs": ".cjs"
+          }));
+        } catch (e) {
+          if (e.code === 'MODULE_NOT_FOUND' || e.code === 'ERR_MODULE_NOT_FOUND') {
+            console.warn(`You have to install "${dependency}" in order to use htmlnano's "${moduleName}" module`);
+          } else {
+            throw e;
+          }
+        }
+      });
+      const module = moduleName in modules ? await modules[moduleName]() : await (specifier => new Promise(r => r(`${specifier}`)).then(s => _interopRequireWildcard(require(s))))(__transformExtension(`./modules/${moduleName}.mjs`, {
+        ".mjs": ".cjs"
+      }));
+      if (typeof module.onAttrs === 'function') {
+        attrsHandlers.push(module.onAttrs(options, moduleOptions));
+      }
+      if (typeof module.onContent === 'function') {
+        contentsHandlers.push(module.onContent(options, moduleOptions));
+      }
+      if (typeof module.onNode === 'function') {
+        nodeHandlers.push(module.onNode(options, moduleOptions));
+      }
+      if (typeof module.default === 'function') {
+        promise = promise.then(async tree => await module.default(tree, options, moduleOptions));
+      }
+    }
+    if (attrsHandlers.length + contentsHandlers.length + nodeHandlers.length === 0) {
+      return promise;
+    }
+    return promise.then(tree => {
+      tree.walk(node => {
+        if (node) {
+          if (node.attrs && typeof node.attrs === 'object') {
+            // Convert all attrs' key to lower case
+            let newAttrsObj = {};
+            Object.entries(node.attrs).forEach(([attrName, attrValue]) => {
+              newAttrsObj[attrName.toLowerCase()] = attrValue;
+            });
+            for (const handler of attrsHandlers) {
+              newAttrsObj = handler(newAttrsObj, node);
+            }
+            node.attrs = newAttrsObj;
+          }
+          if (node.content) {
+            node.content = typeof node.content === 'string' ? [node.content] : node.content;
+            if (Array.isArray(node.content) && node.content.length > 0) {
+              for (const handler of contentsHandlers) {
+                const result = handler(node.content, node);
+                node.content = typeof result === 'string' ? [result] : result;
+              }
+            }
+          }
+          for (const handler of nodeHandlers) {
+            node = handler(node);
+          }
+        }
+        return node;
+      });
+      return tree;
+    });
+  };
+}
+htmlnano.getRequiredOptionalDependencies = function (optionsRun, presetRun) {
+  const [options] = loadConfig(optionsRun, presetRun);
+  return [...new Set(Object.keys(options).filter(moduleName => options[moduleName]).map(moduleName => optionalDependencies[moduleName]).flat())];
+};
+htmlnano.process = function (html, options, preset, postHtmlOptions) {
+  return (0, _posthtml.default)([htmlnano(options, preset)]).process(html, postHtmlOptions);
+};
+
+// https://github.com/webpack-contrib/html-minimizer-webpack-plugin/blob/faca00f2219514bc671c5942685721f0b5dbaa70/src/utils.js#L74
+htmlnano.htmlMinimizerWebpackPluginMinify = function htmlNano(input, minimizerOptions = {}) {
+  const [[, code]] = Object.entries(input);
+  return htmlnano.process(code, minimizerOptions, presets.safe).then(result => {
+    return {
+      code: result.html
+    };
+  });
+};
+htmlnano.presets = presets;
+var _default = exports.default = htmlnano;