postcss-cli-simple

Simple CLI for postcss. To be used in Makefiles. If you are looking for more options check out postcss-cli. More on the history of this project.

Installation

npm install postcss-cli-simple

Usage

postcss [options] -o output-file input-file

In Makefile you can use it with pattern rules:

1deploy/%.css: %.css
2  ./node_modules/.bin/postcss \
3    --use postcss-url --postcss-url.url=rebase \
4    --use autoprefixer --autoprefixer.browsers "> 5%" \
5    --use cssnano --no-cssnano.discardUnused
6    --output $@ $<

--output|-o

Output file name.

--use|-u

Plugin to be used. Multiple plugins can be specified. At least one plugin needs to be specified either with --use option or in the config file.

Plugin options can be specified using yargs dot notation. For example, to pass browsers option to autoprefixer one can use --autoprefixer.browsers "> 5%". To set plugin option to false use yargs boolean negation. For example, to switch off discardUnused in cssnano try: --no-cssnano.discardUnused.

--map|-m

Activate source map generation. By default inline maps are generated. To generate source maps in a separate .map file use --map file or --no-map.inline.

You can use advances source map options - some examples:

• --no-map - do not generated source maps - even if previous maps exist
• --map.annotation <path> - specify alternaive path to be used in source map annotation appended to CSS
• --no-map.annotation - supress adding annotation to CSS
• --no-map.sourcesContent - remove origin CSS from maps

--config|-c

JSON file with plugin configuration. Plugin names should be the keys.

1{
2    "autoprefixer": {
3        "browsers": "> 5%"
4    },
5    "postcss-cachify": {
6        "baseUrl": "/res"
7    }
8}

JavaScript configuration can be used if functions are allowed as plugins parameters. Although you might be better off writing your own plugin.

1module.exports = {
2  "postcss-url": {
3    url: function(url) { return "http://example.com/" + url; }
4  },
5  autoprefixer: {
6    browsers: "> 5%"
7  }
8};

Alternatively configuration options can be passed as --plugin.option parameters.

Note that command-line options can also be specified in the config file:

1{
2    "use": ["autoprefixer", "postcss-cachify"],
3    "output": "bundle.css",
4    "autoprefixer": {
5        "browsers": "> 5%"
6    },
7    "postcss-cachify": {
8        "baseUrl": "/res"
9    }
10}

--syntax|-s

Optional module to use as a custom PostCSS syntax.

--parser|-p

Optional module to use as a custom PostCSS input parser.

--stringifier|-t

Optional module to use as a custom PostCSS output stringifier.

--help|-h

Show help

Examples

Use autoprefixer as a postcss plugin pass parameters from a json file

postcss --use autoprefixer -c options.json -o screen.css screen.css

Use more than one plugin and pass config parameters

postcss --use autoprefixer --autoprefixer.browsers "> 5%" \
    --use postcss-cachify --postcss-cachify.baseUrl /res \
    -o screen.css screen.css

License

MIT