React App Rewire PostCSS lets you configure PostCSS in Create React App v1 and v2 without ejecting.
Add React App Rewire PostCSS to your Rewired React app:
npm install react-app-rewire-postcss --save-dev
Next, add React App Rewire PostCSS to config-overrides.js
in your React app
directory:
module.exports = config => {
require('react-app-rewire-postcss')(config/*, options */);
return config;
};
That’s it! Now you can control PostCSS with all the configuration options from PostCSS Loader:
module.exports = config => {
require('react-app-rewire-postcss')(config, {
plugins: loader => [
require('postcss-preset-env')()
]
});
return config;
};
Alternatively, you can now use postcss.config.js
in your React app directory:
module.exports = config => {
require('react-app-rewire-postcss')(config, true /* any truthy value will do */);
return config;
};
module.exports = {
plugins: {
'postcss-preset-env': {
stage: 0
}
}
};
And you can leverage Browserslist by adding a .browserslistrc
to your React
app directory:
# browsers we support
> 2%
not dead
Happy PostCSS’ing!