A Razzle 2.x plugin for PostCSS (with primer for supporting for SCSS syntax).
Instead of locking your postCSS config to the core project postCSS configurations, this gives you the freedom to shoot yourself in the foot. Or style your Razzle project, whichever.
Example options for each plugin can be found inside of testdata. Once you have your desired options, pass it to modify
which will return a Razzle plugin compliant modify function. It just works.
// razzle.config.js
const modifyBuilder = require('razzle-plugin-postcss').default
const cssConfig = {
postcssPlugins: [
require('stylelint')({
ignorePath: '/node_modules/**/*.css'
}),
require('autoprefixer')({
browsers: [
'>1%',
'last 4 versions',
'Firefox ESR',
'not ie < 9' // React doesn't support IE8 anyway
]
})
]
}
const modify = modifyBuilder({ cssConfig })
module.exports = {
plugins: [ { func: modify }]
}
Note: Your package.json must import postcss-scss
for this to work, the plugin simply enables the syntax at compile time.
All available configuration options are defined in their respective repositories, which can be found searching on npm or at PostCSS.