<style>
Transformer
Weex
Features
- convert a
<style>
element to JSON format - autofix common mistakes
- friendly warnings
API
parse(code, done)
validate(json, done)
validateItem(name, value)
util api
util.hyphenedToCamelCase(value)
util.camelCaseToHyphened(value)
/** * Parse `<style>` code to a JSON Object and log errors & warnings * * @param * @param */ {} /** * Validate a JSON Object and log errors & warnings * * @param * @param */ {} /** * Result callback * * data * - jsonStyle{}: `classname.propname.value`-like object * - log[{line, column, reason}] * * @param * @param */ {} /** * Validate a single name-value pair * * @param * @param * @return * - value * - log */ {}
Validation
- rule check: only common rule type supported, othres will be ignored
- selector check: only single-classname selector is supported, others will be ignored
- prop name check: out-of-defined prop name will be warned but preserved
- prop value check: common prop value mistakes will be autofixed or ignored
- color type: keywords,
#xxx
-> warning:#xxxxxx
- color type:
transparent
-> error: not supported - length type:
100px
-> warning:100
- color type: keywords,
Demo
var styler = var code = 'html {color: #000000;} .foo {color: red; -webkit-transform: rotate(90deg); width: 200px;}' styler var jsonStyle = foo: color: 'red' webkitTransform: 'rotate(90deg)' width: '200px' styler