minify-html-literals - npm Package Compare versions

Comparing version 1.1.2 to 1.2.0

CHANGELOG.md

@@ -5,2 +5,10 @@ # Change Log
 
+<a name="1.2.0"></a>
+
+# [1.2.0](https://github.com/asyncLiz/minify-html-literals/compare/v1.1.2...v1.2.0) (2019-02-13)
+
+### Features
+
+- add ability to minify css-tagged templates ([d37a037](https://github.com/asyncLiz/minify-html-literals/commit/d37a037)), closes [#3](https://github.com/asyncLiz/minify-html-literals/issues/3)
+
 <a name="1.1.2"></a>
@@ -7,0 +15,0 @@

package.json

 {
   "name": "minify-html-literals",
-  "version": "1.1.2",
+  "version": "1.2.0",
   "description": "Minify HTML template literal strings",
@@ -60,2 +60,3 @@ "main": "index.js",
     "@types/html-minifier": "^3.5.2",
+    "clean-css": "^4.2.1",
     "html-minifier": "^3.5.21",
@@ -67,2 +68,3 @@ "magic-string": "^0.25.0",
     "@types/chai": "^4.1.4",
+    "@types/clean-css": "^4.2.0",
     "@types/mocha": "^5.2.5",
@@ -69,0 +71,0 @@ "@types/node": "^10.5.2",

README.md

@@ -75,7 +75,9 @@ # minify-html-literals
 
-| Property         | Type                                                                                         | Default                | Description                                                                                                                                                         |
-| ---------------- | -------------------------------------------------------------------------------------------- | ---------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `fileName`       | string                                                                                       |                        | _Required._ The name of the file, used for syntax parsing and source maps.                                                                                          |
-| `minifyOptions?` | [html-minifier options](https://www.npmjs.com/package/html-minifier#options-quick-reference) | `defaultMinifyOptions` | Defaults to production-ready minification.                                                                                                                          |
-| `shouldMinify?`  | function                                                                                     | `defaultShouldMinify`  | A function that determines whether or not a template should be minified. Defaults to minify all tagged templates whose tag name contains "html" (case insensitive). |
+| Property                    | Type                                                                                         | Default                   | Description                                                                                                                                                               |
+| --------------------------- | -------------------------------------------------------------------------------------------- | ------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `fileName`                  | string                                                                                       |                           | _Required._ The name of the file, used for syntax parsing and source maps.                                                                                                |
+| `minifyOptions?`            | [html-minifier options](https://www.npmjs.com/package/html-minifier#options-quick-reference) | `defaultMinifyOptions`    | Defaults to production-ready minification.                                                                                                                                |
+| `minifyOptions?.minifyCSS?` | [clean-css options](https://www.npmjs.com/package/clean-css#constructor-options)             | `defaultMinifyCSSOptions` | Uses clean-css defaults.                                                                                                                                                  |
+| `shouldMinify?`             | function                                                                                     | `defaultShouldMinify`     | A function that determines whether or not an HTML template should be minified. Defaults to minify all tagged templates whose tag name contains "html" (case insensitive). |
+| `shouldMinifyCSS?`          | function                                                                                     | `defaultShouldMinifyCSS`  | A function that determines whether or not a CSS template should be minified. Defaults to minify all tagged templates whose tag name contains "css" (case insensitive).    |
 
@@ -97,18 +99,6 @@ ### Advanced
 
-### Do not minify CSS
+### Minify non-tagged templates
 
-```js
-import { minifyHTMLLiterals, defaultMinifyOptions } from 'minify-html-literals';
+> This is particularly useful for libraries that define templates without using tags, such as Polymer's `<dom-module>`.
 
-minifyHTMLLiterals(source, {
-  fileName: 'render.js',
-  minifyOptions: {
-    ...defaultMinifyOptions,
-    minifyCSS: false
-  }
-});
-```
-
-### Minify non-tagged templates
-
 ```js
@@ -118,10 +108,13 @@ import { minifyHTMLLiterals, defaultShouldMinify } from 'minify-html-literals';
 minifyHTMLLiterals(
-  `function render() {
-    return html\`
-      <h1>This tagged template is minified</h1>
-      \${\`
-        <div>and so is this non-tagged template</div>
-      \`}
+  `
+    template.innerHTML = \`
+      <dom-module id="custom-styles">
+        <style>
+          html {
+            --custom-color: blue;
+          }
+        </style>
+      </dom-module>
     \`;
-  }`,
+  `,
   {
@@ -133,3 +126,3 @@ fileName: 'render.js',
         template.parts.some(part => {
-          return part.text.includes('<div>');
+          return part.text.includes('<dom-module>');
         })
@@ -142,2 +135,17 @@ );
 
+### Do not minify CSS
+
+```js
+import { minifyHTMLLiterals, defaultMinifyOptions } from 'minify-html-literals';
+
+minifyHTMLLiterals(source, {
+  fileName: 'render.js',
+  minifyOptions: {
+    ...defaultMinifyOptions,
+    minifyCSS: false
+  },
+  shouldMinifyCSS: () => false
+});
+```
+
 ### Modify generated SourceMap
@@ -144,0 +152,0 @@

src/minifyHTMLLiterals.d.ts

@@ -81,2 +81,11 @@ import { SourceMapOptions } from 'magic-string';
     /**
+     * Determines whether or not a CSS template should be minified. The default is
+     * to minify all tagged template whose tag name contains "css" (case
+     * insensitive).
+     *
+     * @param template the template to check
+     * @returns true if the template should be minified
+     */
+    shouldMinifyCSS?(template: Template): boolean;
+    /**
      * Override custom validation or set to false to disable validation. This is
@@ -170,2 +179,11 @@ * only useful when implementing your own strategy that may return
 /**
+ * The default method to determine whether or not to minify a CSS template. It
+ * will return true for all tagged templates whose tag name contains "css" (case
+ * insensitive).
+ *
+ * @param template the template to check
+ * @returns true if the template should be minified
+ */
+export declare function defaultShouldMinifyCSS(template: Template): boolean;
+/**
  * The default validation.
@@ -172,0 +190,0 @@ */

src/minifyHTMLLiterals.js

@@ -36,2 +36,14 @@ "use strict";
 /**
+ * The default method to determine whether or not to minify a CSS template. It
+ * will return true for all tagged templates whose tag name contains "css" (case
+ * insensitive).
+ *
+ * @param template the template to check
+ * @returns true if the template should be minified
+ */
+function defaultShouldMinifyCSS(template) {
+    return !!template.tag && template.tag.toLowerCase().includes('css');
+}
+exports.defaultShouldMinifyCSS = defaultShouldMinifyCSS;
+/**
  * The default validation.
@@ -65,2 +77,5 @@ */
     }
+    if (!options.shouldMinifyCSS) {
+        options.shouldMinifyCSS = defaultShouldMinifyCSS;
+    }
     options.parseLiteralsOptions = {
@@ -72,3 +87,3 @@ ...{ fileName: options.fileName },
     const strategy = options.strategy || strategy_1.defaultStrategy;
-    const { shouldMinify } = options;
+    const { shouldMinify, shouldMinifyCSS } = options;
     let validate;
@@ -80,3 +95,5 @@ if (options.validate !== false) {
     templates.forEach(template => {
-        if (shouldMinify(template)) {
+        const minifyHTML = shouldMinify(template);
+        const minifyCSS = !!strategy.minifyCSS && shouldMinifyCSS(template);
+        if (minifyHTML || minifyCSS) {
             const placeholder = strategy.getPlaceholder(template.parts);
@@ -86,4 +103,20 @@ if (validate) {
             }
-            const html = strategy.combineHTMLStrings(template.parts, placeholder);
-            const min = strategy.minifyHTML(html, options.minifyOptions);
+            const combined = strategy.combineHTMLStrings(template.parts, placeholder);
+            let min;
+            if (minifyCSS) {
+                const minifyCSSOptions = (options.minifyOptions || {}).minifyCSS;
+                if (typeof minifyCSSOptions === 'function') {
+                    min = minifyCSSOptions(combined);
+                }
+                else if (minifyCSSOptions === false) {
+                    min = combined;
+                }
+                else {
+                    const cssOptions = typeof minifyCSSOptions === 'object' ? minifyCSSOptions : undefined;
+                    min = strategy.minifyCSS(combined, cssOptions);
+                }
+            }
+            else {
+                min = strategy.minifyHTML(combined, options.minifyOptions);
+            }
             const minParts = strategy.splitHTMLByPlaceholder(min, placeholder);
@@ -90,0 +123,0 @@ if (validate) {

src/minifyHTMLLiterals.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"minifyHTMLLiterals.js","sourceRoot":"","sources":["minifyHTMLLiterals.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"minifyHTMLLiterals.js","sourceRoot":"","sources":["minifyHTMLLiterals.ts"],"names":[],"mappings":"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"}

src/minifyHTMLLiterals.ts

@@ -90,2 +90,11 @@ import MagicString, { SourceMapOptions } from 'magic-string';
   /**
+   * Determines whether or not a CSS template should be minified. The default is
+   * to minify all tagged template whose tag name contains "css" (case
+   * insensitive).
+   *
+   * @param template the template to check
+   * @returns true if the template should be minified
+   */
+  shouldMinifyCSS?(template: Template): boolean;
+  /**
    * Override custom validation or set to false to disable validation. This is
@@ -197,2 +206,14 @@ * only useful when implementing your own strategy that may return
 /**
+ * The default method to determine whether or not to minify a CSS template. It
+ * will return true for all tagged templates whose tag name contains "css" (case
+ * insensitive).
+ *
+ * @param template the template to check
+ * @returns true if the template should be minified
+ */
+export function defaultShouldMinifyCSS(template: Template) {
+  return !!template.tag && template.tag.toLowerCase().includes('css');
+}
+
+/**
  * The default validation.
@@ -258,2 +279,6 @@ */
 
+  if (!options.shouldMinifyCSS) {
+    options.shouldMinifyCSS = defaultShouldMinifyCSS;
+  }
+
   options.parseLiteralsOptions = {
@@ -265,4 +290,5 @@ ...{ fileName: options.fileName },
   const templates = options.parseLiterals(source, options.parseLiteralsOptions);
-  const strategy = (<CustomOptions<any>>options).strategy || defaultStrategy;
-  const { shouldMinify } = options;
+  const strategy =
+    <Strategy>(<CustomOptions<any>>options).strategy || defaultStrategy;
+  const { shouldMinify, shouldMinifyCSS } = options;
   let validate: Validation | undefined;
@@ -275,3 +301,5 @@ if (options.validate !== false) {
   templates.forEach(template => {
-    if (shouldMinify(template)) {
+    const minifyHTML = shouldMinify(template);
+    const minifyCSS = !!strategy.minifyCSS && shouldMinifyCSS(template);
+    if (minifyHTML || minifyCSS) {
       const placeholder = strategy.getPlaceholder(template.parts);
@@ -282,4 +310,19 @@ if (validate) {
 
-      const html = strategy.combineHTMLStrings(template.parts, placeholder);
-      const min = strategy.minifyHTML(html, options.minifyOptions);
+      const combined = strategy.combineHTMLStrings(template.parts, placeholder);
+      let min: string;
+      if (minifyCSS) {
+        const minifyCSSOptions = (options.minifyOptions || {}).minifyCSS;
+        if (typeof minifyCSSOptions === 'function') {
+          min = minifyCSSOptions(combined);
+        } else if (minifyCSSOptions === false) {
+          min = combined;
+        } else {
+          const cssOptions =
+            typeof minifyCSSOptions === 'object' ? minifyCSSOptions : undefined;
+          min = strategy.minifyCSS!(combined, cssOptions);
+        }
+      } else {
+        min = strategy.minifyHTML(combined, options.minifyOptions);
+      }
+
       const minParts = strategy.splitHTMLByPlaceholder(min, placeholder);
@@ -286,0 +329,0 @@ if (validate) {

src/strategy.d.ts

@@ -1,7 +0,11 @@
-import { Options } from 'html-minifier';
+import * as CleanCSS from 'clean-css';
+import { Options as HTMLOptions } from 'html-minifier';
 import { TemplatePart } from 'parse-literals';
 /**
- * A strategy on how to minify HTML.
+ * A strategy on how to minify HTML and optionally CSS.
+ *
+ * @template O minify HTML options
+ * @template C minify CSS options
  */
-export interface Strategy<O = any> {
+export interface Strategy<O = any, C = any> {
     /**
@@ -33,3 +37,3 @@ * Retrieve a placeholder for the given array of template parts. The
      * @param html the html to minify
-     * @param options minify options
+     * @param options html minify options
      * @returns minified HTML string
@@ -39,2 +43,10 @@ */
     /**
+     * Minifies the provided CSS string.
+     *
+     * @param css the css to minfiy
+     * @param options css minify options
+     * @returns minified CSS string
+     */
+    minifyCSS?(css: string, options?: C): string;
+    /**
      * Splits a minfied HTML string back into an array of strings from the
@@ -51,9 +63,15 @@ * provided placeholder. The returned array of strings should be the same
 /**
+ * The default <code>clean-css</code> options, optimized for production
+ * minification.
+ */
+export declare const defaultMinifyCSSOptions: CleanCSS.Options;
+/**
  * The default <code>html-minifier</code> options, optimized for production
  * minification.
  */
-export declare const defaultMinifyOptions: Options;
+export declare const defaultMinifyOptions: HTMLOptions;
 /**
- * The default strategy. This uses <code>html-minifier</code> to minify HTML.
+ * The default strategy. This uses <code>html-minifier</code> to minify HTML and
+ * <code>clean-css</code> to minify CSS.
  */
-export declare const defaultStrategy: Strategy<Options>;
+export declare const defaultStrategy: Strategy<HTMLOptions, CleanCSS.Options>;

src/strategy.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const CleanCSS = require("clean-css");
 const html_minifier_1 = require("html-minifier");
 /**
+ * The default <code>clean-css</code> options, optimized for production
+ * minification.
+ */
+exports.defaultMinifyCSSOptions = {};
+/**
  * The default <code>html-minifier</code> options, optimized for production
@@ -12,3 +18,3 @@ * minification.
     decodeEntities: true,
-    minifyCSS: true,
+    minifyCSS: exports.defaultMinifyCSSOptions,
     minifyJS: true,
@@ -24,3 +30,4 @@ processConditionalComments: true,
 /**
- * The default strategy. This uses <code>html-minifier</code> to minify HTML.
+ * The default strategy. This uses <code>html-minifier</code> to minify HTML and
+ * <code>clean-css</code> to minify CSS.
  */
@@ -76,2 +83,9 @@ exports.defaultStrategy = {
     },
+    minifyCSS(css, options = {}) {
+        const output = new CleanCSS(options).minify(css);
+        if (output.errors && output.errors.length) {
+            throw new Error(output.errors.join('\n\n'));
+        }
+        return output.styles;
+    },
     splitHTMLByPlaceholder(html, placeholder) {
@@ -78,0 +92,0 @@ // Make the last character (a semicolon) optional. See above.

src/strategy.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"strategy.js","sourceRoot":"","sources":["strategy.ts"],"names":[],"mappings":";;AAAA,iDAAgD;AAiDhD;;;GAGG;AACU,QAAA,oBAAoB,GAAY;IAC3C,aAAa,EAAE,IAAI;IACnB,kBAAkB,EAAE,IAAI;IACxB,cAAc,EAAE,IAAI;IACpB,SAAS,EAAE,IAAI;IACf,QAAQ,EAAE,IAAI;IACd,0BAA0B,EAAE,IAAI;IAChC,qBAAqB,EAAE,IAAI;IAC3B,cAAc,EAAE,IAAI;IACpB,qBAAqB,EAAE,IAAI;IAC3B,0BAA0B,EAAE,IAAI;IAChC,6BAA6B,EAAE,IAAI;IACnC,eAAe,EAAE,IAAI;CACtB,CAAC;AAEF;;GAEG;AACU,QAAA,eAAe,GAAsB;IAChD,cAAc,CAAC,KAAK;QAClB,sEAAsE;QACtE,uEAAuE;QACvE,oEAAoE;QACpE,sCAAsC;QACtC,MAAM,MAAM,GAAG,KAAK,CAAC;QACrB,IAAI,WAAW,GAAG,sBAAsB,CAAC;QACzC,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,WAAW,GAAG,MAAM,CAAC,CAAC,EAAE;YACnE,WAAW,IAAI,GAAG,CAAC;SACpB;QAED,OAAO,WAAW,GAAG,MAAM,CAAC;IAC9B,CAAC;IACD,kBAAkB,CAAC,KAAK,EAAE,WAAW;QACnC,OAAO,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IACxD,CAAC;IACD,UAAU,CAAC,IAAI,EAAE,OAAO,GAAG,EAAE;QAC3B,IAAI,gBAAqB,CAAC;QAC1B,IAAI,OAAO,CAAC,SAAS,EAAE;YACrB,IACE,OAAO,CAAC,SAAS,KAAK,IAAI;gBAC1B,OAAO,OAAO,CAAC,SAAS,KAAK,UAAU,EACvC;gBACA,gBAAgB,GAAG,EAAE,GAAG,OAAO,CAAC,SAAS,EAAE,CAAC;aAC7C;iBAAM;gBACL,gBAAgB,GAAG,EAAE,CAAC;aACvB;SACF;aAAM;YACL,gBAAgB,GAAG,KAAK,CAAC;SAC1B;QAED,IAAI,gBAAgB,IAAI,OAAO,gBAAgB,CAAC,KAAK,KAAK,WAAW,EAAE;YACrE,gBAAgB,CAAC,KAAK,GAAG;gBACvB,CAAC,EAAE;oBACD,SAAS,CAAC,SAAiB,EAAE,KAAa;wBACxC,IACE,KAAK,CAAC,UAAU,CAAC,sBAAsB,CAAC;4BACxC,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EACpB;4BACA,kEAAkE;4BAClE,8BAA8B;4BAC9B,OAAO,GAAG,KAAK,GAAG,CAAC;yBACpB;oBACH,CAAC;iBACF;aACF,CAAC;SACH;QAED,OAAO,sBAAM,CAAC,IAAI,EAAE;YAClB,GAAG,OAAO;YACV,SAAS,EAAE,gBAAgB;SAC5B,CAAC,CAAC;IACL,CAAC;IACD,sBAAsB,CAAC,IAAI,EAAE,WAAW;QACtC,6DAA6D;QAC7D,yDAAyD;QACzD,OAAO,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC;IACjC,CAAC;CACF,CAAC"}
+{"version":3,"file":"strategy.js","sourceRoot":"","sources":["strategy.ts"],"names":[],"mappings":"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"}

src/strategy.ts

@@ -1,8 +0,12 @@
-import { Options, minify } from 'html-minifier';
+import * as CleanCSS from 'clean-css';
+import { Options as HTMLOptions, minify } from 'html-minifier';
 import { TemplatePart } from 'parse-literals';
 
 /**
- * A strategy on how to minify HTML.
+ * A strategy on how to minify HTML and optionally CSS.
+ *
+ * @template O minify HTML options
+ * @template C minify CSS options
  */
-export interface Strategy<O = any> {
+export interface Strategy<O = any, C = any> {
   /**
@@ -34,3 +38,3 @@ * Retrieve a placeholder for the given array of template parts. The
    * @param html the html to minify
-   * @param options minify options
+   * @param options html minify options
    * @returns minified HTML string
@@ -40,2 +44,10 @@ */
   /**
+   * Minifies the provided CSS string.
+   *
+   * @param css the css to minfiy
+   * @param options css minify options
+   * @returns minified CSS string
+   */
+  minifyCSS?(css: string, options?: C): string;
+  /**
    * Splits a minfied HTML string back into an array of strings from the
@@ -53,10 +65,16 @@ * provided placeholder. The returned array of strings should be the same
 /**
+ * The default <code>clean-css</code> options, optimized for production
+ * minification.
+ */
+export const defaultMinifyCSSOptions: CleanCSS.Options = {};
+
+/**
  * The default <code>html-minifier</code> options, optimized for production
  * minification.
  */
-export const defaultMinifyOptions: Options = {
+export const defaultMinifyOptions: HTMLOptions = {
   caseSensitive: true,
   collapseWhitespace: true,
   decodeEntities: true,
-  minifyCSS: true,
+  minifyCSS: defaultMinifyCSSOptions,
   minifyJS: true,
@@ -73,5 +91,6 @@ processConditionalComments: true,
 /**
- * The default strategy. This uses <code>html-minifier</code> to minify HTML.
+ * The default strategy. This uses <code>html-minifier</code> to minify HTML and
+ * <code>clean-css</code> to minify CSS.
  */
-export const defaultStrategy: Strategy<Options> = {
+export const defaultStrategy: Strategy<HTMLOptions, CleanCSS.Options> = {
   getPlaceholder(parts) {
@@ -130,2 +149,10 @@ // Using @ and (); will cause the expression not to be removed in CSS.
   },
+  minifyCSS(css, options = {}) {
+    const output = new CleanCSS(options).minify(css);
+    if (output.errors && output.errors.length) {
+      throw new Error(output.errors.join('\n\n'));
+    }
+
+    return output.styles;
+  },
   splitHTMLByPlaceholder(html, placeholder) {
@@ -132,0 +159,0 @@ // Make the last character (a semicolon) optional. See above.

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

55985

16.73%

Lines of code

1008

17.21%

Number of lines in readme file

160

5.26%

Worsened metrics

Dependency count

5

25%

Dev dependency count

18

5.88%

Dependency changes

• + Added

  clean-css@^4.2.1