struct-css

Archetype: Node.js package

struct-css enables two-way conversion of raw CSS into a structured JavaScript object representation and vice versa.

Install

npm install struct-css

Usage

structure

Converts raw CSS to a structured JavaScript representation.

import { struct } from 'struct-css';

const cssString = 'div { color: blue; font-size: 16px; }';
const structure = struct(cssString);

console.log(structure);
console.log(structure.rules[0].declarations[0].property); // Output: 'color'

Output (Prettyfied for example):

{
	"rules":
	[
		{
		"selectors": ["div"],
		"declarations":
			[
				{ "property": "color", "value": "blue" },
				{ "property": "font-size", "value": "16px" }
			],
		"rules": []
		}
	]
}

css

Converts a structured JavaScript representation back to raw CSS.

import { css } from 'struct-css';

const structure = {
    rules: [
        {
            selectors: ['div'],
            declarations: [
                { property: 'color', value: 'blue' },
                { property: 'font-size', value: '16px' },
            ],
            rules: [],
        },
    ],
    declarations: [],
};

const cssString = css(structure);
console.log(cssString);

Output Raw CSS string Prettyfied for example

div {
    color: blue;
    font-size: 16px;
}

License

Apache-2.0 License. See LICENSE for details.