0.4.0 • Published 4 years ago
figma-exporter v0.4.0
Figma Exporter
NodeJS library that helps with exporting Figma project.
Install
npm i figma-exporter
Usage
Before you get started, generate a Figma access token. This will be used to authenticate with the Figma API and get access to the files you want to export.
You will also need your file id so the module knows which to run the export on.
const FigmaExporter = require('figma-exportor').default;
const client = new FigmaExporter("<your_figma_token>", "<file_id>");
- Then, declare the list of Figma nodes in your project you want to export. The module accepts both node names and node ids and can handle
PAGE
,CANVAS
, andFRAME
types. The example below will collect information about 6 Figma nodes:
const filter = {
name: [
'Onboarding',
'Footer'
],
id: [
'1:24',
'31:25',
'1:100',
'1:47'
]
};
let nodes = await client.collectNodes(filter)
This outputs the following format:
[
{ id: '1:419', name: 'Onboarding', images: [] },
{ id: '31:7299', name: 'Footer', images: [] },
{ id: '1:24', name: 'Header', images: [] },
...
]
- Then, you can request the image urls in a format of your liking. Supported formats are
jpg
,png
,svg
pdf
;
let images = await client.getNodeImageUrls('png')
This outputs the following format:
[
{
id: '1:419',
name: 'Onboarding',
images: [{
imageUrl: '<url>',
imageFormat: 'png'
}]
},
{
id: '31:7299',
name: 'Footer',
images: [{
imageUrl: '<url>',
imageFormat: 'png'
}]
},
...
]
- Finally, write the images and metadata (
data.json
) to a folder. The default folder for this is./figma-export
.
let result = await client.writeImages('./data');
This outputs the following format, which corresponds to the data that is written to data.json
:
[
{
id: '1:419',
name: 'Onboarding',
images: [{
imageUrl: '<url>',
imageFormat: 'png',
fileName: 'Onboarding.png'
}]
},
{
id: '31:7299',
name: 'Footer',
images: [{
imageUrl: '<url>',
imageFormat: 'png',
fileName: 'Footer.png'
}]
},
...
Full example that export Splashscreen
and Contact
to both svg and pdf:
const FigmaExporter = require('figma-exportor').default
const client = new FigmaExporter("<your_figma_token>", "<file_id>");
const filter = {
name: [
'Splashscreen',
'Contact'
]
}
const nodes = await client.collectNodes(filter);
const nodesWithImages = await client.getNodeImageUrls('svg');
const nodesWithImages = await client.getNodeImageUrls('pdf');
const result = await client.writeImages();