Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including postcss-cli with all npm packages installed. Try it out:

var postcssCli = require("postcss-cli")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

postcss-cli v5.0.0

CLI for PostCSS

npm node deps Greenkeeper badge tests cover chat



npm i -g|-D postcss-cli


  postcss [input.css] [OPTIONS] [-o|--output output.css] [--watch|-w]
  postcss <input.css>... [OPTIONS] --dir <output-directory> [--watch|-w]
  postcss <input-directory> [OPTIONS] --dir <output-directory> [--watch|-w]
  postcss <input.css>... [OPTIONS] --replace

Basic options:
  -o, --output   Output file                                            [string]
  -d, --dir      Output directory                                       [string]
  -r, --replace  Replace (overwrite) the input file                    [boolean]
  --map, -m      Create an external sourcemap
  --no-map       Disable the default inline sourcemaps
  --verbose      Be verbose                                            [boolean]
  --watch, -w    Watch files for changes and recompile as needed       [boolean]
  --env          A shortcut for setting NODE_ENV                        [string]

Options for when not using a config file:
  -u, --use      List of postcss plugins to use                          [array]
  --parser       Custom postcss parser                                  [string]
  --stringifier  Custom postcss stringifier                             [string]
  --syntax       Custom postcss syntax                                  [string]

Advanced options:
  --ext     Override the output file extension; for use with --dir      [string]
  --base    Mirror the directory structure relative to this path in the output
            directory, for use with --dir                               [string]
  --poll    Use polling for file watching. Can optionally pass polling interval;
            default 100 ms
  --config  Set a custom path to look for a config file                 [string]

  --version  Show version number                                       [boolean]
  -h, --help     Show help                                             [boolean]

  postcss input.css -o output.css                       Basic usage
  cat input.css | postcss -u autoprefixer > output.css  Piping input & output

If no input files are passed, it reads from stdin. If neither -o, --dir, or
--replace is passed, it writes to stdout.

If there are multiple input files, the --dir or --replace option must be passed.

Input files may contain globs. If you pass an input directory, it will process
all files in the directory and any subdirectories.

ℹ️ More details on custom parsers, stringifiers and syntaxes, can be found here.


If you need to pass options to your plugins, or have a long plugin chain, you'll want to use a configuration file.


module.exports = {
  parser: 'sugarss',
  plugins: [
    require('postcss-import')({ ...options }),
    require('postcss-url')({ url: 'copy', useHash: true })

Note that you can not set the from or to options for postcss in the config file. They are set automatically based on the CLI arguments.


For more advanced usage it's recommend to to use a function in postcss.config.js, this gives you access to the CLI context to dynamically apply options and plugins per file

file{Object}dirname, basename, extnameFile
options{Object}map, parser, syntax, stringifierPostCSS Options


module.exports = ctx => ({
  parser: ctx.file.extname === '.sss' ? 'sugarss' : false,
  plugins: {
    'postcss-import': { root: ctx.file.dirname },
    cssnano: ctx.env === 'production' ? {} : false

⚠️ If you want to set options via CLI, it's mandatory to reference ctx.options in postcss.config.js

postcss input.sss -p sugarss -o output.css -m


module.exports = ctx => ({
  parser: ctx.options.parser,
  plugins: {
    'postcss-import': { root: ctx.file.dirname },
    cssnano: ctx.env === 'production' ? {} : false
RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free