Submarine
Submarine takes a directory full of markdown files and convert them into a static site of HTML pages, including a table of contents page.
Install
npm install submarine -g
Usage
API Example
var submarine = require('submarine')
var options = {
input_dir: 'content',
output_dir: 'site',
header: 'API Example', // optional
footer: 'hi this shows in the footer', // optional
template: 'custom/default.html', // optional
assets: 'custom/assetsdirectory' // optional
}
submarine(options, callback)
function callback (err) {
if(err) return console.log(err)
console.log('how wonderful.')
}
Command Line
Submarine takes 2 arguments, [input_dir]
for where the markdown files live, and [output_dir]
for where your static site will live.
Usage: submarine [input_directory] [output_directory]
Options:
--header=<header> customize static site header, default to "Submarine"
--footer=<footer> customize static site footer
--template=<file> use a custom template
--assets=<directory> use a custom assets directory
--version prints current version
Command Line Example
Imagine your file structure looks like this:
guide/
1_hello_world.md
2_sup_world.md
3_cool_story_world.md
4_yolo_world.md
Then run this in this directory:
$ submarine guide site --header=Submarine --footer='Nice footer.'
The markdown files in ./guide
will be converted, and a static site will be created in ./site
. Your new file structure will look like this:
guide/
1_hello_world.md
2_sup_world.md
3_cool_story_world.md
4_yolo_world.md
site/
1_hello_world.html
2_sup_world.html
3_cool_story_world.html
4_yolo_world.html
index.html
assets/main.css
Template
You can specify a custom template with --template=cooltemplate.html
, see the default template for an example. It's super easy, just write a single HTML file that contains these variables:
{{> header }}
a string, retrived through options.header{{> footer }}
a string, retrived through options.footer{{# index }}
an array of objects(markdown -> html pages), each has 2 keys:href
,name
{{{ content }}}
markdown converted to HTML{{ previous }}
file name of the previous page{{ next }}
file name of the next page
Assets
You can specify a custom assets directory with --assets=assetsdirectory
. This directory will be copied into your chosen output directory so you can include all your css, javascript and any other static assets you want. And don't worry, sub-directories will also be copied.
License
MIT
About
This, as well as many node modules now exist in the world, was inspired by a conversation with @maxogden. Perhaps you should hang out with him some time too.