cssnano-preset-advanced

    5.1.4 • Public • Published

    cssnano-preset-advanced

    Advanced optimisations for cssnano; may or may not break your CSS!

    Table of Contents

    Usage

    Install

    With npm do:

    npm install cssnano-preset-advanced --save-dev
    

    If you don't have npm then check out this installation tutorial.

    Configuration

    If you would like to use the preset in its default configuration, specify a section in your package.json:

     {
       "name": "awesome-application",
    +  "cssnano": {
    +    "preset": "advanced"
    +  }
     }

    But should you wish to customise this, you can pass an array with the second parameter as the options object to use. For example, to remove all comments:

     {
       "name": "awesome-application",
    +  "cssnano": {
    +    "preset": [
    +      "advanced",
    +      {"discardComments": {"removeAll": true}}
    +    ]
    +  }
     }

    Depending on your usage, the JSON configuration might not work for you, such as in cases where you would like to use options with customisable function parameters. For this use case, we recommend a cssnano.config.js at the same location as your package.json. You can then load a preset and export it with your custom parameters:

    const advancedPreset = require('cssnano-preset-advanced');
    
    module.exports = advancedPreset({
      discardComments: {
        remove: (comment) => comment[0] === '@',
      },
    });

    Note that you may wish to publish your own preset to npm for reusability, should it differ a lot from this one. This is highly encouraged!

    Plugins

    autoprefixer (external)

    Parse CSS and add vendor prefixes to CSS rules using values from the Can I Use website

    This plugin is loaded with the following configuration:

    {
      add: false;
    }

    css-declaration-sorter (external)

    Sorts CSS declarations fast and automatically in a certain order.

    This plugin is loaded with the following configuration:

    {
      exclude: true;
    }

    cssnano-utils

    Utility methods used by cssnano

    postcss-calc (external)

    PostCSS plugin to reduce calc()

    This plugin is loaded with its default configuration.

    postcss-colormin

    Minify colors in your CSS files with PostCSS.

    This plugin is loaded with its default configuration.

    postcss-convert-values

    Convert values with PostCSS (e.g. ms -> s)

    This plugin is loaded with the following configuration:

    {
      length: false;
    }

    postcss-discard-comments

    Discard comments in your CSS files with PostCSS.

    This plugin is loaded with its default configuration.

    postcss-discard-duplicates

    Discard duplicate rules in your CSS files with PostCSS.

    This plugin is loaded with its default configuration.

    postcss-discard-empty

    Discard empty rules and values with PostCSS.

    This plugin is loaded with its default configuration.

    postcss-discard-overridden

    PostCSS plugin to discard overridden @keyframes or @counter-style.

    This plugin is loaded with its default configuration.

    postcss-discard-unused

    Discard unused counter styles, keyframes and fonts.

    This plugin is loaded with its default configuration.

    postcss-merge-idents

    Merge keyframe and counter style identifiers.

    This plugin is loaded with its default configuration.

    postcss-merge-longhand

    Merge longhand properties into shorthand with PostCSS.

    This plugin is loaded with its default configuration.

    postcss-merge-rules

    Merge CSS rules with PostCSS.

    This plugin is loaded with its default configuration.

    postcss-minify-font-values

    Minify font declarations with PostCSS

    This plugin is loaded with its default configuration.

    postcss-minify-gradients

    Minify gradient parameters with PostCSS.

    This plugin is loaded with its default configuration.

    postcss-minify-params

    Minify at-rule params with PostCSS

    This plugin is loaded with its default configuration.

    postcss-minify-selectors

    Minify selectors with PostCSS.

    This plugin is loaded with its default configuration.

    postcss-normalize-charset

    Add necessary or remove extra charset with PostCSS

    This plugin is loaded with the following configuration:

    {
      add: false;
    }

    postcss-normalize-display-values

    Normalize multiple value display syntaxes into single values.

    This plugin is loaded with its default configuration.

    postcss-normalize-positions

    Normalize keyword values for position into length values.

    This plugin is loaded with its default configuration.

    postcss-normalize-repeat-style

    Convert two value syntax for repeat-style into one value.

    This plugin is loaded with its default configuration.

    postcss-normalize-string

    Normalize wrapping quotes for CSS string literals.

    This plugin is loaded with its default configuration.

    postcss-normalize-timing-functions

    Normalize CSS animation/transition timing functions.

    This plugin is loaded with its default configuration.

    postcss-normalize-unicode

    Normalize unicode-range descriptors, and can convert to wildcard ranges.

    This plugin is loaded with its default configuration.

    postcss-normalize-url

    Normalize URLs with PostCSS

    This plugin is loaded with its default configuration.

    postcss-normalize-whitespace

    Trim whitespace inside and around CSS rules & declarations.

    This plugin is loaded with its default configuration.

    postcss-ordered-values

    Ensure values are ordered consistently in your CSS.

    This plugin is loaded with its default configuration.

    postcss-reduce-idents

    Reduce custom identifiers with PostCSS.

    This plugin is loaded with its default configuration.

    postcss-reduce-initial

    Reduce initial definitions to the actual initial value, where possible.

    This plugin is loaded with its default configuration.

    postcss-reduce-transforms

    Reduce transform functions with PostCSS.

    This plugin is loaded with its default configuration.

    postcss-svgo

    Optimise inline SVG with PostCSS.

    This plugin is loaded with its default configuration.

    postcss-unique-selectors

    Ensure CSS selectors are unique.

    This plugin is loaded with its default configuration.

    postcss-zindex

    Reduce z-index values with PostCSS.

    This plugin is loaded with its default configuration.

    Contributors

    See CONTRIBUTORS.md.

    License

    MIT © Ben Briggs

    Keywords

    none

    Install

    npm i cssnano-preset-advanced

    DownloadsWeekly Downloads

    70,015

    Version

    5.1.4

    License

    MIT

    Unpacked Size

    14.8 kB

    Total Files

    4

    Last publish

    Collaborators

    • beneb
    • ludovicofischer
    • ai
    • chriseppstein
    • andyjansson
    • evilebottnawi
    • cssnano-bot