How to use postcss-calc - 3 common examples

const {
    elements = {},
    aliases = {},
    plugins = []
  } = options

  return postcss([
    ...plugins,

    // /** optimize css */
    discardComments({ removeAll: false }),
    minifyGradients(),
    normalizeDisplayValues(),
    normalizeTimingFunctions(),
    convertValues({ length: false }),
    reduceCalc(),
    orderedValues(),
    minifySelectors(),
    minifyParams(),
    discardOverridden(),
    normalizeString(),
    minifyFontValues({ removeQuotes: false }),
    normalizeRepeatStyle(),
    normalizePositions(),
    discardEmpty(),
    uniqueSelectors(),
    declarationSorter(),
    mergeAdjacentMedia(),
    discardDuplicates(),
    mergeRules(),

    /** color handling */

features: (
				configValueDefined('config.dev.styles.features') ?
				config.dev.styles.features :
				{
					'custom-media-queries': {
						preserve: false
					},
					'custom-properties': {
						// Preserve must always be false for the editor
						preserve: false
					},
					'nesting-rules': true
				}
			)
		}),
		calc({
			preserve: false
		}),
		cssnano(),
	];

	// Skip minifying files if we aren't building for
	// production and debug is enabled
	if( config.dev.debug.styles && ! isProd ) {
		postcssPlugins.pop();
	}

	// Report messages from other postcss plugins
	postcssPlugins.push(
		reporter({ clearReportedMessages: true })
	);

),
			features: (
				configValueDefined('config.dev.styles.features') ?
				config.dev.styles.features :
				{
					'custom-media-queries': {
						preserve: false
					},
					'custom-properties': {
						preserve: true
					},
					'nesting-rules': true
				}
			)
		}),
		calc({
			preserve: false
		}),
		cssnano(),
	];

	// Skip minifying files if we aren't building for
	// production and debug is enabled
	if( config.dev.debug.styles && ! isProd ) {
		postcssPlugins.pop();
	}

	// Report messages from other postcss plugins
	postcssPlugins.push(
		reporter({ clearReportedMessages: true })
	);