cssnano-preset-advanced

v9.0.5

Published

12 hours ago

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

Downloads

5,428,769

0High
0Medium
0Low

cssnano-preset-advanced

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

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, add it to your cssnano.config.js:

// cssnano.config.js
module.exports = {
  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:

// cssnano.config.js
module.exports = {
  preset: [
    'advanced',
    { discardComments: { removeAll: true } },
  ],
};

For options with customisable function parameters, use 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 the following configuration:

{
  plugins: [
    {
      name: 'preset-default',
      params: {
        overrides: {
          removeViewBox: false,
        },
      },
    },
  ],
}

`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.

Published

Vulnerabilities

Links

Maintainers

Keywords

Readme

cssnano-preset-advanced

Table of Contents

Usage

Install

Configuration

Plugins

autoprefixer (external)

css-declaration-sorter (external)

postcss-calc (external)

Contributors

License

`autoprefixer` (external)

`css-declaration-sorter` (external)

`postcss-calc` (external)