数ページしかない静的ページを面倒な諸々なしにお手軽に作成したいを叶えるツール

Super Simple Static Site Generator = SSSSG を作った

https://github.com/sters/ssssg

READMEに使い方を書いたけれど、YAMLを書いて、ファイルを設置、ビルドすると書かれてる通りにやってくれる。

画像ファイル…というか、staticなファイルはコマンド実行するパイプラインをかけるので、いろいろできる。

Project Structure
my-site/
  site.yaml          # Site definition (data, URLs, pages)
  templates/
    _layout.html      # Shared layout (_ prefix = shared file)
    _header.html      # Partial
    _footer.html      # Partial
    index.html        # Page template
  static/             # Static files (copied to output as-is)
  public/             # Output directory (generated)

site.yaml
global:
  layout: "_layout.html"
  data:
    site_name: "My Site"
  fetch:
    reset_css: "https://cdn.example.com/reset.css"
    custom_css: "static/style.css"

pages:
  - template: "index.html"
    output: "index.html"
    data:
      title: "Home"
      greeting: "Welcome!"
    fetch:
      projects: "https://api.example.com/projects.json"

  - template: "about.html"
    output: "about/index.html"
    layout: "_other_layout.html"
    data:
      title: "About"

static:
  pipelines:
    - match: "*.jpg"
      commands:
        - "cp {{.Src}} {{.Dest}}"
        - "mogrify -resize 800x600 {{.Dest}}"
        - "jpegoptim --strip-all {{.Dest}}"
    - match: "*.png"
      commands:
        - "cp {{.Src}} {{.Dest}}"
        - "optipng -o2 {{.Dest}}"
    - match: "images/*.webp"
      commands:
        - "cwebp -q 80 {{.Src}} -o {{.Dest}}"

で、実践投入して便利〜〜〜とさっきやったところだけど何か既視感が….

…あ！これ、gulpでやったことあるやつだ！

gulp.js

じゃあgulpでいいじゃんという気もするけれど、1バイナリでシュッとできるので…（gulpもnpxとかでできそうな気もするが）