Here are some real-world Spignite examples. Even though we didn't talk about existing operations, these examples will be understandable.
const { Spig } = require('spignite');​Spig.hello();​Spig.on('/**/*.{md,njk}')​._("INIT").pageMeta().pageLinks().tags()​._("RENDER").render().applyTemplate().htmlMinify();​Spig.on('/**/*.{png,jpg,gif}')​._("INIT").assetLinks()​._("IMG").imageMinify();​Spig.run();
This is how one simple website is built. Let's dig the code.
Spig.hello
defines the HELLO
phase with all the default operations that works on default structure: dealing with css, javascript, images, static etc. Content and layers are not covered.
INIT
phase for markdown files collect some meta-data (attributes) and define the output links. Similar thing happens on the second set (images), where only output links are defined.
INIT
phase on the first set also collect tags and pages that defines them.
RENDER
phase is one that process markdown files to HTML (render()
operation), then applies the template, and finally, performs the HTML minification of the code.
Images set does not have the RENDER
phase, but the IMG
phase, where images gets minified.
The order of phases is: HELLO
, INIT
, RENDER
, IMG
.
const { Spig } = require('spignite');​Spig.hello();​function postsToRoot(path) {if (path.dirname.startsWith('/posts/')) {path.dirname = path.dirname.substr(6);}}​Spig.on('/**/*.{md,njk}').watchSite()​._('META').pageMeta().readingTime().tags().summary()​._('INIT').do('slug-from-title', fileRef => {...}).pageLinks().rename(postsToRoot)​._('RENDER').render().applyTemplate().htmlMinify();​Spig.on('/**/*.{png,jpg,gif}')​._('IMAGES').assetLinks().rename(postsToRoot);​Spig.on('/index.json')​._('RENDER^BEFORE').pageMeta().applyTemplate();​Spig.run();
This example has two custom javascript codes: one is a function postsToRoot
and the second is a lambda in line #22 (removed for simplicity).
Content files this time defines also reading time and extract the summary, all in META
phase. In other words, we just collect meta-data about the content.
INIT
phase is all about links. It defines page slugs from the page title and removes the /post/
prefix from the URL.
RENDER
phase is the same as in previous example.
IMAGES
process the images from the content folder. Note that images from the /src/images
are processed in HELLO
phase, defined in defaults by Spig.hello()
.
index.json
is some kind of meta-data file that needs to exist on website. It is executed before RENDER
phase. This is the only time in the pipeline when we have both the target links defined AND the content is still in Markdown.