@reboost/plugin-postcss v0.21.0
PostCSS Plugin
Adds support for transforming stylesheets with PostCSS. This plugin does not work with PostCSS versions below 8, if you want to use PostCSS 7, please use the older version of this plugin.
Usage
Setup
Install it using npm
npm i -D @reboost/plugin-postcssInstall postcss package, if not already installed.
npm i postcssImport it from the package
const { start } = require('reboost');
const PostCSSPlugin = require('@reboost/plugin-postcss');Add it to the plugins array
const { start } = require('reboost');
const PostCSSPlugin = require('@reboost/plugin-postcss');
start({
plugins: [
PostCSSPlugin({
// Options
})
]
})Now it will transform all stylesheets with your PostCSS plugins.
Config file
This plugin uses postcss-load-config to load PostCSS
configurations. Please read their readme
to understand how configuration files are loaded.
Options
ctx
Type: object
This plugin exposes context ctx to the config file, so that your config file can be dynamic.
Like so
postcss.config.js
module.exports = ({ file, options, env }) => {
parser: file.extname === '.sss' ? 'sugarss' : undefined
// More configurations
}You can set ctx to an object to pass the data to the options object in
your postcss.config.js, like so
reboost.js
const { start } = require('reboost');
const PostCSSPlugin = require('@reboost/plugin-postcss');
start({
plugins: [
PostCSSPlugin({
ctx: {
usePreset: true
}
})
]
})postcss.config.js
module.exports = ({ file, options, env }) => {
plugins: {
// `usePreset` is now available in `options` object
'postcss-preset-env': options.usePreset ? {} : false
}
}path
Type: string
The path to search for any of the configuration files. Configurations can be loaded from
Using this option you can specify another directory that should be searched for the config file, like when you store your config files in different directories. The value should be a path to a DIRECTORY (where the config file is stored), not a path to a FILE.