Fetching from Figma

Sometimes you just want to run a fetch without building the whole static site.

Fetch only

If you run npm run fetch, this will fetch and run the transformers to get all the token data from Figma, but will not generate the static site. The contents of the fetch and transform will be exported to the exported directory.

  • tokens.json - A JSON representation of all the tokens extracted from Figma
  • changelog.json - A changelog indicating changes since the last run
  • preview.json - A JSON representation of the iframe-able preview components
  • variables/ - A folder containing the css and sass variables for each component

Regenerate the previews

If you run npm run transform:preview, this will use the already fetched content and only generate new previews. We use this internally for regenerating previews when a template file changes during watch mode. Its useful if you change a template but are happy to reuse the existing tokens rather than refetching

  • preview.json - A JSON representation of the iframe-able preview components

Regenerate the tokens

If you run npm run transform:styles, this will use the already fetched content and only generate new style tokens. We use this internally for regenerating style tokens without refetching the main tokens file.

  • variables/ - A folder containing the css and sass variables for each component