React Native
This template helps you generate your design tokens as a React Native theme and icons as JSX components
This example uses the following parsers:
to-react-native to generate your design tokens as a React Native theme
convert-dimension to convert dimensions token from px to unitless values
svg-to-jsx to generate icons as JSX components
If you use the CLI, you need to fill three properties:
repository
is@organization/repository
personalAccessToken
which you can generate in your account settingsrules
are where you provide parsers and compatible options
{
"version": "2",
"repository": "@organization/repository",
// Only use the personalAccessToken when working with the CLI
"personalAccessToken": "<your-personal-access-token>",
"rules": [
{
"name": "Generate tokens as a React Native theme",
"parsers": [
{
"name": "convert-dimension",
"options": {
"toFormat": null
}
},
{
"name": "to-react-native",
"output": {
"type": "file",
"filePath": "theme.js"
}
}
]
},
{
"name": "Optimize and transform vectors with svgo + Generate JSX components",
"parsers": [
{
"name": "svgo",
"options": {
"svgo": {
"plugins": [
{
"name": "removeDimensions"
},
{
"name": "convertColors",
"params": {
"currentColor": true
}
}
]
}
}
},
{
"name": "svg-to-jsx",
"output": {
"type": "directory",
"directoryPath": "output/assets"
}
}
]
}
]
}
Last updated
Was this helpful?