Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/andresilva-cc/grafex/llms.txt

Use this file to discover all available pages before exploring further.

renderAll() is a convenience function for compositions that define multiple variants — for example, an OG image, a Twitter card, and a square thumbnail all produced from the same .tsx file. Instead of calling render() once per variant and managing the loop yourself, renderAll() iterates every entry in config.variants, renders each one with the shared browser instance, and returns a Map keyed by variant name. The composition module is loaded only once regardless of how many variants are defined, so the function is efficient even for large variant sets.

​
Signature

async function renderAll(
  compositionPath: string,
  options?: Omit<RenderOptions, 'variant'>,
): Promise<Map<string, RenderResult>>

​
Parameters

​
compositionPath
string
required
Path to the .tsx composition file. Resolved relative to the current working directory of the Node.js process.
​
options
Omit<RenderOptions, 'variant'>
Optional configuration object. Accepts all fields from RenderOptions except variant — renderAll always renders every variant, so specifying one by name is not applicable here. Any option you provide is applied uniformly across every variant render, acting as a final override on top of each variant’s own config values.

​
Return value

Returns a Promise that resolves to a Map<string, RenderResult>. Each key is the variant name exactly as it appears in config.variants. Each value is a full RenderResult for that variant.
​
Map key
string
required
The variant name string from config.variants — for example 'og', 'twitter', or 'square'.
​
Map value — buffer
Buffer
required
Raw image data for this variant. Write directly to a file with fs.writeFile.
​
Map value — width
number
required
Effective render width in pixels for this variant, after applying scale.
​
Map value — height
number
required
Effective render height in pixels for this variant, after applying scale.
​
Map value — scale
number
required
The device pixel ratio used for this variant’s render.
​
Map value — format
'png' | 'jpeg'
required
The output format used for this variant.

​
Behavior when no variants are defined

If the composition file does not export a config with a non-empty variants record, renderAll() throws an error: 
Error: pipelineAll() requires a composition with config.variants defined.
Use render() instead for compositions without variants, or use getCompositionConfig() and hasVariants() to check before calling renderAll(). 
import { getCompositionConfig, hasVariants, renderAll, render, close } from 'grafex';

const config = await getCompositionConfig('./card.tsx');

try {
  if (hasVariants(config)) {
    const all = await renderAll('./card.tsx');
    // process map...
  } else {
    const result = await render('./card.tsx');
    // process single result...
  }
} finally {
  await close();
}

​
Examples

import { renderAll, close } from 'grafex';
import { writeFile } from 'node:fs/promises';

// composition exports config.variants: { og: {}, twitter: { height: 675 }, square: { width: 1080, height: 1080 } }

try {
  const results = await renderAll('./card.tsx');

  for (const [name, result] of results) {
    const filename = `./dist/${name}.${result.format}`;
    await writeFile(filename, result.buffer);
    console.log(`Saved ${filename} — ${result.width}×${result.height}`);
  }
} finally {
  await close();
}

// Output:
// Saved ./dist/og.png — 1200×630
// Saved ./dist/twitter.png — 1200×675
// Saved ./dist/square.png — 1080×1080
Variants are rendered sequentially in the order they appear in config.variants. The map iteration order matches the definition order, so for...of over the result map gives you results in the same sequence.
Per-call options act as final overrides — they apply on top of each individual variant’s settings. This lets you, for example, force scale: 2 across all variants without modifying the composition’s config file.

Build docs developers (and LLMs) love

Get started for freeTalk to us