PostCSS Constants With Reload
PostCSS plugin to process imported constants from a file.
constants.js
moduleexports = colors: primary: '#8EE7D3' ;
input
@/
output
Within static values
constants.js
moduleexports = borders: weight: '2px' style: 'solid' ;
input
@/
output
@ Rules
constants.js
moduleexports = queries: maxWidth: '200px'
input
@/{
output
{
Usage
You can pass a default set of constants (that can be overriden), if you want to update default constants in webpack hot reload:
you can pass an alias
option, which will be used to resolve related constants file
then you can write code like this
@/
if 'css' was found in alias option, 'css/constants.js' will be parsed to complete path
webpack user?
you can pass an webpack
option in option
{ return ;}
it will add constants files as dependency. when you modify the constants file, it causes webpack recomplie all related resource and livereload in browser.
Call postcss-constants
before any plugins that will compute values stored in constants. See PostCSS docs for examples for your environment.