Converts css transform string to an object and vice versa
npm install transform-parserA small utility which converts css transform string to an object and vice versa.
``bash
npm i transform-parser
yarn add transform-parser
`
You can also addtransform-parser directly to your webpage and use it. The package will be availablewindow.transform
under .
`html`
Like React, the default unit is px(pixel). When a number is passed as value, it will be suffixed
with px and vice verse. Of course, the substitution will be skipped for transforms which requiresscale3d()
numeral values, like .
`javascript
import { parse, stringify } from 'transform-parser';
const transformString =
'translate3d(10px, 40px, 24px) scale3d(1.1, 1.1, 1.1) perspective(20px)';
parse(transformString);
// => {translate3d: [10, 40, 24], scale3d(1.1, 1.1, 1.1), perspective: 20}
const transformObject = {
rotate3d: [1, 2.0, 3.0, '10deg'],
scale3d: [1.1, 1.1, 1.1],
skewX: '30deg',
};
stringify(transformObject);
// => 'rotate3d(1, 2.0, 3.0, 10deg) scale3d(1.1, 1.1, 1.1) skewX(30deg)'
`
`bash``
yarn install
yarn build
yarn test
MIT