Metalsmith SSG

For discussions about different technology stacks. What tools are you using to create your website? Share them here!
Post Reply
User avatar
Yukinu
Site Admin
Posts: 81
Joined: Tue Oct 11, 2022 1:11 am

Metalsmith SSG

Post by Yukinu »

Metalsmith is the SSG I use to create the main yukinu site. In reality, Metalsmith is not strictly an SSG, but rather a generic framework for transforming files. Metalsmith is written in JavaScript and the codebase is quite small; most of the functionality comes from plugins.

Here is a basic Metalsmith example:

Code: Select all

var Metalsmith  = require('metalsmith');
var markdown    = require('metalsmith-markdown');

Metalsmith(__dirname)
  .source('./src')
  .destination('./build')
  .use(markdown())
  .build(function(err) {
    if (err) throw err;
  });
This code loads all of the files in ./src into memory, and converts the markdown content to html for each file with .md extension using the metalsmith-markdown plugin, changing the extension to .html. Once all plugins have run, the files are written to ./build.

Writing plugins for Metalsmith is quite simple; You create a function with 3 arguments (files, metalsmith, done), and register the function with a call to .use(). Here is a basic plugin, it just loop through all the loaded files and transforms their contents:

Code: Select all

function(files, metalsmith, done) {
  for (var i = 0; i < files.length; i++) {
    var fileName = files[i];
    var file = files[fileName];
    var content = file.content;
    
    // Transform content here.
    
    file.content = content;
  }
  
  done();
}
My site is currently using ~30 plugins. Half of the plugins are from the NPM package repo, the other half are custom plugins that I use to, among other things, generate the feeds, modify html, generate redirects, and build the zine.
Post Reply