graphviz-exec-loader

Webpack loader for Graphviz files that invokes the Graphviz binaries directly
Graphviz Exec Loader
This Webpack loader calls external Graphviz binaries to process Graphviz files into any format that the Graphviz tools can emit.
If you want a pure JavaScript solution, you may want to investigate graphviz-loader, which uses an Emscripten compiled version of Graphviz.
Installation
You will need the Graphviz binaries, such as dot
, installed on your system.
How you do that is distribution dependent, but usually involves installing a
package named something like graphviz
.
From there, this is just a standard NPM package:
yarn add -D graphviz-exec-loader
Usage
You can use this for .dot
files like any other loader. Here's a sample block
from a Webpack configuration I have:
{
test: /\.dot$/,
loader: "graphviz-exec-loader",
options: {
command: "dot"
}
}
The command
option is mandatory, and is the command that will be run
(typically one of dot
, neato
, et cetera). You may also provide an optional
format
option, which will override the -T
parameter given to the tool; this
defaults to svg
.
The output of the loader is a data URI that would generally be included
directly into an <img />
element or a background: url(...)
style
definition.
Known issues
I've only tested this with Webpack 3. It may well work with 4, but someone will have to test that.