postcss-values-parser

What are postcss-values-parser's main functionalities?

const parse = require('postcss-values-parser').parse;
let root = parse('10px solid black');
console.log(root.nodes);

const parse = require('postcss-values-parser').parse;
let root = parse('10px solid black');
root.walk((node) => console.log(node));

const parse = require('postcss-values-parser').parse;
let root = parse('10px solid black');
root.nodes[0].value = '15px';
console.log(root.toString());

postcss-values-parser

A CSS property value parser built upon PostCSS, following the same node and traversal patterns as PostCSS.

Install

Using npm:

npm install postcss-values-parser --save-dev

Please consider becoming a patron if you find this module useful.

Requirements

postcss-values-parser Node version v6.14.0+ and PostCSS v7.0.0+.

Benefits

• Leverages PostCSS and its tokenizer under the hood
• Doesn't strip characters; eg. parenthesis
• Full AST traversal
• Ability to walk the AST for every Node type
• Convenience methods to stringify Nodes
• Follows PostCSS patterns for whitespace between Nodes
• Provides convenience properties for number units, colors, etc.

Usage

Using the parser is straightforward and minimalistic:

const { parse } = require('postcss-values-parser');

const root = parse('#fff');
const node = root.first;

// → Word {
//     raws: { before: '', after: '' },
//     value: '#fff',
//     type: 'word',
//     isHex: true,
//     isColor: true,
//     isVariable: false,
//     ...
//   }

Please see the Documentation for further information on using the module.

Meta

CONTRIBUTING

LICENSE (Mozilla Public License)