The flatjs plugin @flatjs/forge-plugin-postcss-pixel

Features

A plugin for PostCSS that generates rpx/rem units from px/rpx units

Installation

``shell
$ npm i --save @flatjs/forge-plugin-postcss-pixel
`

Usage

programing

`tsx
import postcss from 'postcss';
import { writeFile, readFileSync } from 'fs';
import { forgePluginPostcssPixel } from '@flatjs/forge-plugin-postcss-pixel';
const css = readFileSync('/path/to/test.css', 'utf8');
const options = {
replace: false,
};
const processedCss = postcss(forgePluginPostcssPixel(options)).process(css).css;

writeFile('/path/to/test.rem.css', processedCss, err => {
if (err) throw err;
console.log('Rem file written.');
});
`

Using with @flatjs/forge

Please see samples of @flatjs/forge-plugin-styling

Defaults Configuration

`typescript
const defaultOpts: Required = {
rootValue: { px: 100, rpx: 1 },
outputUnit: 'rem',
unitPrecision: 5,
selectorBlackList: [],
propWhiteList: [],
propBlackList: [],
replace: true,
mediaQuery: false,
minPixelValue: 0,
ignoreIdentifier: '',
exclude: null,
};

``

Reference

- postcss playground