@hubot-friends/sfab NPM

Static Site Generator

This is a simple static site generator that uses Express, markdown, and Handlebars to generate a static website.

Installation

To install the dependencies, run: npm i

Example building a site

./
./docs
./docs/index.md
./docs/layouts/
.docs/layouts/index.html

index.md

---
title: Getting Started With sfab
layout: layouts/index.html
published: 2023-10-14T19:25:22.000Z
permalink: /index.html
---

# Getting Started With sfab

This is an example markdown file that utilizes the layouts/index.html layout file.

layouts/index.html

<!DOCTYPE html>
<html lang="en">
    <head></head>
    <body>
    {{> @partial-block }}
    </body>
</html>

Run it

npx @hubot-friends/sfab --folder ./docs --destination ./_site --verbose

If you install it globally (`npm i @hubot-friends/sfab -g`)

# builds the site and starts a web server (Express) using a virtual path, e.g. /hubot/. If there's no virtual path (just at the roo), then just `--serve` with no additional value.
sfab --folder ./docs --destination ./_site --verbose --serve /hubot/

Restart when files change (requires Node.js version 20.6.x --watch facility)

sfab --folder ./docs --destination ./_site --verbose --serve /hubot/ --watch-path ./docs

Hook into the build process

npx @hubot-friends/sfab --folder ./docs --destination ./_site --verbose --serve /hubot/ --watch-path ./docs --scripts ./sfab-hooks

Copy another folder to destination

sfab --folder ./docs --destination ./_site --verbose --serve /hubot/ --watch-path ./docs --copy ./resources

Example Hook

export default () => {
    return {
        model(file, model) {
            // object returned gets Object.assigned to the model passed to the handlebars compiler for use in the templates.
            return {
                base: {
                    href: '/hubot/'
                }
            }
        },
        async transformed(viewKey, transformedFilePath, model, html, viewModel) { // model is the object passed to the temlating engines, viewModel is the object that comes from markdown meta data or html item props.
            // do something during transformation
        },
        async copied(filePath) {
            // file was copied to this filePath.
        },
        async partial(partialName, partial, handebars) {
            // partial was registered. passing handlebars if you want to register more.
        }
    }
}

npm start -- --folder ../../hubotio/hubot/docs --destination ../../hubotio/hubot/_site --verbose --serve /hubot/ --watch-path ../../hubotio/hubot/docs --scripts ../../hubotio/hubot/sfab-hooks