patternplate-transform-postcss
patternplate patternplate transform applying postcss to css sources
Installation
npm install --save patternplate-transform-postcss postcss postcss-import
Configuration
Install patternplate-transform-postcss
, postcss
and postcss-import
in your patternplate project.
Then add the following configuration to ./configuration/patternplate-server
// ./configuration/patternplate-server/transforms.js postcss: inFormat: 'css' outFormat: 'css' plugins: ...
// ./configuration/patternplate-server/patterns.js formats: css: transforms: 'postcss'
Plugins
The transform supports arbitrary postcss
plugins.
To use a plugin you have to install it via npm install --save ${pluginName}
.
To make the transform pick up the plugin you have to configure it - this is done by adding an object under patternplate-server.transforms.postcss[${pluginName}]
. This will cause the transform to require
and initialize the plugin.
// ./configuration/patternplate-server/transforms.js postcss: plugins: pluginName: ...
Everything found in patternplate-server.transforms.postcss[${pluginName}].options
will be passed directly.
Via the special order key you can determine the order of plugins during postcss
initialization.
// ./configuration/patternplate-server/transforms.js postcss: plugins: pluginName: // e.g. postcss-import order: 1 // index of the plugin in postcss configuration, lower means earlier processing, options: // plugin options foo: 'bar'
See also
- patternplate - Create, show and deliver component libraries
- transform-less - Process LESS to CSS
- transform-sass - Process SASS to CSS
Copyright 2016 by SinnerSchrader Deutschland GmbH and contributors. Released under the MIT license.