1.0.5 • Published 2 years ago
intf-style-dictionary v1.0.5
intf-style-dictionary
Design Token System for Interfolio
Description
The purpose of this project is to provide a seamless solution for our FE applications to consume the Axiom Design System.
Getting Started
If the desire is to work with the project directly, then follow the below steps:
- Clone this repository
- From the root level, execute
yarn run build
. This will hit the invision API endpoint and generate all of the styles provided in Axiom.
If the desire is to run this directly from a FE application, then follow the below steps:
- Add the latest version of the npm package
intf-style-dictionary
to your package.json - During install, the invision API endpoint will return the Axiom styles and place them in an
Axiom
folder at the root level of the application. - You can then reference the
_variables.scss
file for the style variables.
Using a config
A default config is provided which builds a _variable.scss inside ./axiom/styles. It is possible to provide a path to a config file for when the default .scss config is not enough.
- Create a config.json file containing the Style-Dictionary compatible config. As well as the Style-Dictionary compatible config. It is possible to provide an extractPath property that sets where the axiom zip is extracted to.
- Run the script as before with additional command line arguments. Two are provided. --config and --extractPath. If the extractPath is not provided. The config will be searched.If the config does not contain an extract path. The default 'axiom' will be used.
npx intf-style-dictionary --config "style-dictionary/config.json"
npx intf-style-dictionary --config 'style-dictionary/config.json' --extractPath 'axiom'