0.1.2 • Published 7 years ago
rn-style-attributes v0.1.2
rn-style-attributes
Babel plugin to add view styles as configurable inline attributes. Show package on npmjs.com Supports React - React Native - ReactXP
Example
In
// input code
<Block
height={33}
collapsable
color={condition ? "red" : "blue"}
/>
Out
// output code
<View
style={{ backgroundColor: condition ? "red" : "blue", height: 33 }}
collapsable
/>
Installation
$ npm install -D rn-style-attributes
Usage
Via .babelrc
(Recommended)
.babelrc
// BlockName is an optional configuration, that is 'Block' if not set.
{
"plugins": [
"rn-style-attributes",
"name": `BlockName`
]
}
Via CLI
$ babel --plugins rn-style-attributes script.js
Via Node API
require("babel-core").transform("code", {
plugins: ["rn-style-attributes"]
});
Test implemented in test/fixtures
To run the test script:
$ npm run test
Test implemented in test/fixtures:
- ALL-Tests
- Keep style attributes and native attributes
- Manage binary ternary
- Manage classic ternary
- Manage ReactXP element with option
- Native attributes must be preserved
- Style attributes wavy
- Style overwrite other attributes