css-customproperties-parser v1.0.2

css-customproperties-parser

Parser css custom properties into JS object.

Api

const CSSParser = require('css-customproperties-parser'),
	path = require('path'),
	CSS_FILE_PATH = path.resolve(__dirname, '/relative/path/to/filename.css');

const CSSobject = CSSParser.toJs(CSS_FILE_PATH);
console.log(CSSobject); // this is result object

CSS variable file has to be this structure, same name properties will be overwritten:

:root {
	--color-divider: var(--palette-grey-200);
	--color-background: var(--color-white);
	--color-text: var(--palette-grey-900);
	--color-text-secondary: var(--palette-grey-600);
	--color-primary: var(--palette-red-600);
	--color-primary-dark: var(--palette-red-900);
	--color-accent: var(--palette-teal-500);
	--color-accent-dark: var(--palette-teal-900);
	--color-primary-contrast: var(--color-dark-contrast);
	--color-accent-contrast: var(--color-dark-contrast);
}

.test { 
	--color-accent-dark: var(--palette-hoola-900);
}

Output:

var result = { 
	'color-divider': 'var(--palette-grey-200)',
	'color-background': 'var(--color-white)',
	'color-text': 'var(--palette-grey-900)',
	'color-text-secondary': 'var(--palette-grey-600)',
	'color-primary': 'var(--palette-red-600)',
	'color-primary-dark': 'var(--palette-red-900)',
	'color-accent': 'var(--palette-teal-500)',
	'color-accent-dark': 'var(--palette-teal-900)',
	'color-primary-contrast': 'var(--color-dark-contrast)',
	'color-accent-contrast': 'var(--color-dark-contrast)' 
}