a postprocessor for fis to change 'px' to 'rem' in stylesheet
npm install fis-postprocessor-px2rema postprocessor for fis to change 'px' to 'rem' in stylesheet.
don't intend to transform the original value, eg: 1px border, add /no*/ after the declaration
intend to use px by force，eg: font-size, add /px*/ after the declaration
Attention: Dealing with SASS or LESS, only /.../ comment can be used, in order to have the comments persisted
npm install -g fis-postprocessor-px2rem
fis.match('*css', {
postprocessor: fis.plugin('px2rem')
});
$3
{
baseDpr: 2, // base device pixel ratio (default: 2)
remVersion: true, // whether to generate rem version (default: true)
remUnit: 75, // rem unit value (default: 75)
remPrecision: 6 // rem precision (default: 6)
}
$3
#### Pre processing:
One raw stylesheet:
.selector {
width: 150px;
height: 64px; /px/
font-size: 28px; /px/
border: 1px solid #ddd; /no/
}
#### After processing:
Rem version:
.selector {
width: 2rem;
border: 1px solid #ddd;
}
[data-dpr="1"] .selector {
height: 32px;
font-size: 14px;
}
[data-dpr="2"] .selector {
height: 64px;
font-size: 28px;
}
[data-dpr="3"] .selector {
height: 96px;
font-size: 42px;
}