Wondering what’s next for npm?Check out our public roadmap! »

    pattern-lab-minify-html

    1.1.1 • Public • Published

    Minify and Beautify Plugin for Pattern Lab Node

    The Minify HTML Plugin allows Pattern Lab Node users to minify and beautify the HTML template of all patterns. If the right options are passed, HTML errors like empty attributes can be prevented (id="" and class="") and the production code size can be reduced.

    Installation

    To add the Tab Plugin to your project using npm type:

    npm install pattern-lab-minify-html
    

    Or add it directly to your project's package.json file and run npm install

    During installation, the plugin is added as a key to the plugins object in your main Pattern Lab project's patternlab-config.json file

    If you don't see this object, try running npm run postinstall within the root of your project.

    Configuration

    Post-installation, you will see the following in your patternlab-config.json:

    Example:

    "pattern-lab-minify-html": {
        "enabled": true,
        "initialized": false,
        "options": {
            "minify": { },
            "beautify": { },
            "pluginOptions": {
                "verbose": false
            }
        }
    }
    

    Minification

    The generated HTML will be minified using html-minifier. The following options can be used as an example:

    "options": {
      "minify": {
        "removeEmptyAttributes": true,
        "preserveLineBreaks": true,
        "keepClosingSlash": true,
        "removeComments": true,
        "conservativeCollapse": true,
        "collapseWhitespace": true
      },
      ...
    },
    

    To use custom html-minifier options pass an object to minify

    To disable minification during production mode set the minify option to false.

    Beautification

    The generated HTML will be beautified using js-beautify. The following options can be used as an example:

    "options": {
        ...
        "beautify": {
            "intent_size": 4,
            "end_with_newline": true,
            "inline": true
        }
    },
    

    To use custom js-beautify options pass an object to beautify

    To disable beatification during production mode set the beautify option to false.

    Enabling / Disabling the Plugin

    After install, you may manually enable or disable the plugin by finding the plugin-node-minify-html key within your main Pattern Lab project's patternlab-config.json file and setting the enabled flag. In the future this will be possible via CLI.

    Install

    npm i pattern-lab-minify-html

    DownloadsWeekly Downloads

    2

    Version

    1.1.1

    License

    MIT

    Unpacked Size

    11 kB

    Total Files

    9

    Last publish

    Collaborators

    • avatar