Introduction

An API Blueprint renderer that supports multiple themes and outputs static HTML that can be served by any web host. API Blueprint is a Markdown-based document format that lets you write API descriptions and documentation in a simple and straightforward way. Currently supported is API Blueprint format 1A.

Note: This project is mature and stable, but I don't have much time for it anymore. If you would like to join as a maintainer then please reach out to my GitHub username at Gmail. Thanks!

Features

• Fast parsing thanks to Protagonist
• Asyncronous processing
• Multiple templates/themes
• Support for custom colors, templates, and theme engines
• Include other documents in your blueprint
• Commandline executable aglio -i service.apib -o api.html
• Live-reloading preview server aglio -i service.apib --server
• Node.js library require('aglio')
• Excellent test coverage
• Tested on BrowserStack

Example Output

Example output is generated from the example API Blueprint using the default Olio theme.

• Default theme two column or three column
• Streak theme two column or three column
• Flatly theme two column or three column
• Slate theme two column or three column
• Cyborg theme two column or three column

Including Files

It is possible to include other files in your blueprint by using a special include directive with a path to the included file relative to the current file's directory. Included files can be written in API Blueprint, Markdown or HTML (or JSON for response examples). Included files can include other files, so be careful of circular references.

<!-- include(filename.md) -->

For tools that do not support this include directive it will just render out as an HTML comment. API Blueprint may support its own mechanism of including files in the future, and this syntax was chosen to not interfere with the external documents proposal while allowing aglio users to include documents today.

Installation & Usage

There are three ways to use aglio: as an executable, in a docker container or as a library for Node.js.

Executable

Install aglio via NPM. You need Node.js installed and you may need to use sudo to install globally:

npm install -g aglio

Then, start generating HTML.

# Default theme
aglio -i input.apib -o output.html

# Use three-column layout
aglio -i input.apib --theme-template triple -o output.html

# Built-in color scheme
aglio --theme-variables slate -i input.apib -o output.html

# Customize a built-in style
aglio --theme-style default --theme-style ./my-style.less -i input.apib -o output.html

# Custom layout template
aglio --theme-template /path/to/template.jade -i input.apib -o output.html

# Custom theme engine
aglio -t my-engine -i input.apib -o output.html

# Run a live preview server on http://localhost:3000/
aglio -i input.apib -s

# Print output to terminal (useful for piping)
aglio -i input.apib -o -

# Disable condensing navigation links
aglio --no-theme-condense -i input.apib -o output.html

# Render full-width page instead of fixed max width
aglio --theme-full-width -i input.apib -o output.html

# Set an explicit file include path and read from stdin
aglio --include-path /path/to/includes -i - -o output.html

# Output verbose error information with stack traces
aglio -i input.apib -o output.html --verbose

With Docker

You can choose to use the provided Dockerfile to build yourself a repeatable and testable environment:

1. Build the image with docker build -t aglio .
2. Run aglio inside a container with docker run -t aglio You can use the -v switch to dynamically mount the folder that holds your API blueprint:

docker run -v $(pwd):/tmp -t aglio -i /tmp/input.apib -o /tmp/output.html

Node.js Library

You can also use aglio as a library. First, install and save it as a dependency:

npm install --save aglio

Then, convert some API Blueprint to HTML:

var aglio = require('aglio');

// Render a blueprint with a template by name
var blueprint = '# Some API Blueprint string';
var options = {
  themeVariables: 'default'
};

aglio.render(blueprint, options, function (err, html, warnings) {
    if (err) return console.log(err);
    if (warnings) console.log(warnings);

    console.log(html);
});

// Render a blueprint with a custom template file
options = {
  themeTemplate: '/path/to/my-template.jade'
};
aglio.render(blueprint, options, function (err, html, warnings) {
    if (err) return console.log(err);
    if (warnings) console.log(warnings);

    console.log(html);
});


// Pass custom locals along to the template, for example
// the following gives templates access to lodash and async
options = {
    themeTemplate: '/path/to/my-template.jade',
    locals: {
        _: require('lodash'),
        async: require('async')
    }
};
aglio.render(blueprint, options, function (err, html, warnings) {
   if (err) return console.log(err);
   if (warnings) console.log(warnings);

   console.log(html);
});

Reference

The following methods are available from the aglio library:

aglio.collectPathsSync (blueprint, includePath)

Get a list of paths that are included in the blueprint. This list can be watched for changes to do things like live reload. The blueprint's own path is not included.

var blueprint = '# GET /foo\n<-- include(example.json -->\n';
var watchPaths = aglio.collectPathsSync(blueprint, process.cwd())

aglio.render (blueprint, options, callback)

Render an API Blueprint string and pass the generated HTML to the callback. The options can either be an object of options or a simple layout name or file path string. Available options are:

| Option | Type | Default | Description | | ----------- | ------ | ------------- | ------------------------------------- | | filterInput | bool | true | Filter \r and \t from the input | | includePath | string | process.cwd() | Base directory for relative includes | | locals | object | {} | Extra locals to pass to templates | | theme | string | 'default' | Theme name to load for rendering |

In addition, the default theme provides the following options:

| Option | Type | Default | Description | | ---------------- | ------ | --------- | -------------------------------------------- | | themeVariables | string | default | Built-in color scheme or path to LESS or CSS | | themeCondenseNav | bool | true | Condense single-action navigation links | | themeFullWidth | bool | false | Use the full page width | | themeTemplate | string | | Layout name or path to custom layout file | | themeStyle | string | default | Built-in style name or path to LESS or CSS |

var blueprint = '...';
var options = {
    themeTemplate: 'default',
    locals: {
        myVariable: 125
    }
};

aglio.render(blueprint, options, function (err, html, warnings) {
    if (err) return console.log(err);

    console.log(html);
});

aglio.renderFile (inputFile, outputFile, options, callback)

Render an API Blueprint file and save the HTML to another file. The input/output file arguments are file paths. The options behaves the same as above for aglio.render, except that the options.includePath defaults to t