This repository was archived by the owner on Feb 18, 2022. It is now read-only.
Description const postcss = require ( "postcss" ) ;
const postcssCustomProperties = require ( "postcss-custom-properties" ) ;
const testStr = `
:root {
---first-color: 255, 255, 0;
--second-color: rgba(var(---first-color), .5);
}
h1 {
color: var(--second-color);
}
` ;
postcss ( [
postcssCustomProperties ( {
} ) ,
] )
. process ( testStr , { from : 'src/app.css' , to : 'dest/app.css' } )
. then ( ( result ) => {
console . log ( result . css ) ;
} ) ;
output css
: root {
---first-color : 255 , 255 , 0 ;
--second-color : rgba (var (---first-color ), .5 );
}
h1 {
color : rgba (var (---first-color ), .5 );
color : var (--second-color );
}
Expect the following code
: root {
---first-color : 255 , 255 , 0 ;
--second-color : rgba (var (---first-color ), .5 );
}
h1 {
color : rgba (255 , 255 , 0 , .5 );
color : var (--second-color );
}
Browsers can recognize variables that start with a '-', but here the plugin cannot recognize them when converting
Reactions are currently unavailable
output css
Expect the following code
Browsers can recognize variables that start with a '-', but here the plugin cannot recognize them when converting