postcss-resolve-prop

PostCSS helper method to resolve a rule's property value.

Introduction

This project exposes a single function that simplifies the process of resolving a CSS rule's property value.

Given a CSS rule:

a {
	color: red;
	color: blue;
}

Once parsed with PostCSS, you can request the value of the color property like so:

var resolveProp = require('postcss-resolve-prop');
resolveProp(rule, 'color'); // blue

Note: inherited properties are not supported at this time.

A more complicated example is when shorthand properties are used.

a {
	font-size: 1rem;
	font: 1.2rem serif;
}

Let's get the font-size:

resolveProp(rule, 'font-size', {
	parsers: {
		font: function(value) {
			return require('parse-css-font')(value).size;
		}
	}
}); // 1.2rem

If no value can be resolved, null will be returned.

Installation

$ npm install postcss-resolve-prop [--save[-dev]]

Usage

require('postcss-resolve-prop')(rule, prop[, options]);

rule

The rule you wish to read. See PostCSS#Rule.

prop

The property you wish to read. See PostCSS#Declaration#prop.

Options

isObjectMode

Type: Boolean Required: false Default: undefined

Accumulates parser result objects into a final result object.

parsers

Type: Object Required: false Default: undefined

An object where the keys map to CSS properties and the values are functions that parse the declaration value into a result.

{
	parser: function(value) {
		return require('parse-css-font')(value).size;
	}
}