or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

cli.mdindex.mdnodejs-api.md
tile.json

tessl/npm-mermaid-js--mermaid-cli

Command-line interface for converting Mermaid diagrams to SVG, PNG, and PDF formats

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/@mermaid-js/mermaid-cli@11.6.x

To install, run

npx @tessl/cli install tessl/npm-mermaid-js--mermaid-cli@11.6.0

index.mddocs/

Mermaid CLI

Mermaid CLI is a command-line interface for converting Mermaid diagram definitions into various output formats including SVG, PNG, and PDF. It provides both a CLI tool (mmdc) and a Node.js API for programmatic usage, supporting single diagrams, batch processing of markdown files, and extensive customization options.

Package Information

  • Package Name: @mermaid-js/mermaid-cli
  • Package Type: npm
  • Language: JavaScript (ESM) with TypeScript support
  • Installation: npm install -g @mermaid-js/mermaid-cli

Core Imports

import { run, renderMermaid, cli, error } from "@mermaid-js/mermaid-cli";

For CommonJS:

const { run, renderMermaid, cli, error } = require("@mermaid-js/mermaid-cli");

Basic Usage

CLI Usage

# Basic diagram conversion
mmdc -i diagram.mmd -o diagram.svg

# Convert with dark theme and transparent background
mmdc -i input.mmd -o output.png -t dark -b transparent

# Process markdown file with embedded mermaid diagrams
mmdc -i README.md -o README-processed.md

# Pipe from stdin
cat diagram.mmd | mmdc -i - -o output.svg

Node.js API Usage

import { run } from "@mermaid-js/mermaid-cli";

// Convert single diagram
await run("diagram.mmd", "output.svg");

// Convert with options
await run("input.mmd", "output.png", {
  outputFormat: "png",
  parseMMDOptions: {
    backgroundColor: "transparent",
    mermaidConfig: { theme: "dark" }
  }
});

Architecture

Mermaid CLI is built around several key components:

  • CLI Interface: Command-line tool (mmdc) with comprehensive option parsing and validation
  • Core Engine: Uses Puppeteer to render diagrams in a headless browser environment
  • Format Support: Converts to SVG, PNG, and PDF with configurable styling options
  • Batch Processing: Processes markdown files containing multiple mermaid code blocks
  • Node.js API: Programmatic interface for integration into Node.js applications

Capabilities

Command Line Interface

Complete CLI tool for converting Mermaid diagrams with extensive customization options including themes, styling, and output formats.

mmdc [options]

Options:
  -i, --input <input>              Input mermaid file or "-" for stdin
  -o, --output [output]            Output file or "-" for stdout
  -e, --outputFormat [format]      Output format: svg, png, pdf
  -t, --theme [theme]              Theme: default, forest, dark, neutral
  -b, --backgroundColor [color]    Background color for PNG/SVG
  -w, --width [width]              Page width (default: 800)
  -H, --height [height]            Page height (default: 600)
  -s, --scale [scale]              Puppeteer scale factor (default: 1)
  -c, --configFile [file]          JSON configuration file for mermaid
  -C, --cssFile [file]             CSS file for styling
  -I, --svgId [id]                 SVG element ID attribute
  -f, --pdfFit                     Scale PDF to fit chart
  -a, --artefacts [path]           Output artefacts path for markdown input
  -p, --puppeteerConfigFile [file] JSON configuration for Puppeteer
  -q, --quiet                      Suppress log output
  --iconPacks <icons...>           Icon packs to use (Iconify NPM packages)

Command Line Interface

Node.js API

Programmatic interface for rendering Mermaid diagrams within Node.js applications, supporting both high-level operations and fine-grained control.

async function run(
  input: string | undefined,
  output: string,
  options?: RunOptions
): Promise<void>;

async function renderMermaid(
  browser: Browser | BrowserContext,
  definition: string,
  outputFormat: "svg" | "png" | "pdf",
  options?: ParseMDDOptions
): Promise<RenderResult>;

interface RunOptions {
  puppeteerConfig?: LaunchOptions;
  quiet?: boolean;
  outputFormat?: "svg" | "png" | "pdf";
  parseMMDOptions?: ParseMDDOptions;
  artefacts?: string;
}

interface RenderResult {
  title: string | null;
  desc: string | null;
  data: Uint8Array;
}

Node.js API

Types

// Puppeteer types used by the API
interface Browser {
  // Puppeteer browser instance
  close(): Promise<void>;
  newPage(): Promise<Page>;
}

interface BrowserContext {
  // Puppeteer browser context instance
  close(): Promise<void>;
  newPage(): Promise<Page>;
}

interface LaunchOptions {
  // Puppeteer launch configuration
  headless?: boolean | "shell";
  args?: string[];
  timeout?: number;
  executablePath?: string;
  [key: string]: any;
}

interface Viewport {
  width: number;
  height: number;
  deviceScaleFactor?: number;
}

interface ParseMDDOptions {
  viewport?: Viewport;
  backgroundColor?: string | "transparent";
  mermaidConfig?: object;
  myCSS?: string;
  pdfFit?: boolean;
  svgId?: string;
  iconPacks?: string[];
}

interface MarkdownImageProps {
  url: string;
  alt: string;
  title?: string | null;
}