Babel Plugin to convert css tagged literals to javascript objects. Intended to be used with CSS-in-JS libraries like glamor.
It transpiles the following
export const $switch = css`
display: inline-flex;
vertical-align: middle;
height: 34px;
align-items: flex-end;
`;
into this
export const $switch = css({
display: 'inline-flex',
verticalAlign: 'middle',
height: '34px',
alignItems: 'flex-end'
});
Use npm
npm install -S babel-plugin-transform-css-tagged-template-to-object
Add the following to your .babelrc
or package.json
. Whichever you prefer.
{
"plugins": [
"transform-css-tagged-template-to-object"
]
}