sweet2: Batman’s toolbelt for static site generation
Infinitely extensibe simple ES6 static site generator.
Installation
$ npm install --save-dev sweet2
Examples below are written in ES6 so you need Babel to run them (but Babel it’s not required to use sweet2):
$ npm install --save-dev babel-cli babel-preset-es2015 babel-preset-stage-2
I also recommend to use http-server to preview your site locally:
$ npm install --save-dev http-server
Your package.json
should look like this:
Now you can use npm run build
to build your site and npm start
to run a local server.
And your .babelrc
should look like this:
Recommended folder structure
.
├── index.js # Generator code
├── config # Configs
│ └── base.yml # Base config
│ └── en.yml # Language specific configs
│ └── ru.yml
├── source # Markdown sources
├── templates # ECT templates
├── public # Generated HTML files
Examples
Simple static site
index.js
:
; ; let config = ;let options = configbase; let renderMarkdown = ;let renderTemplate = ; let documents = ; let pages = ; ;
config/base.yml
:
sourceFolder: sourcesourceTypes: - md - htmltemplatesFolder: templatesassetsFolder: publicpublicFolder: public lang: enurl: http://sapegin.me title: Artem Sapegin’s Home Page
Examples of templates and source files you can find here.
Multilingual blog
- Two languages;
- pagination;
- cut;
- tags;
index.js
:
; ; let config = ;let options = configbase; // Remove language (en or ru) from a URLlet url; let renderMarkdown = ;let renderTemplate = ; let documents = ; // Oder by date, newest firstdocuments = ; // Group posts by languagelet documentsByLanguage = ;let languages = Object; documents = languages; let pages = ; ;
config/base.yml
:
sourceFolder: sourcesourceTypes: - md - htmltemplatesFolder: templatesassetsFolder: publicpublicFolder: publicpostsPerPage: 10postsInFeed: 15cutTag: <!-- cut -->
config/en.yml
:
url: http://blog.sapegin.metitle: Artem Sapegin’s Blogdescription: 'Blog of a Berlin based font-end developer who works at Here, shoot photos and make something awesome on the internet.'author: Artem Sapeginemail: artem@sapegin.metagNames: css: CSS html: HTML javascript: JavaScript thoughts: Thoughts tools: Tools
Examples of templates and source files you can find here.
Advanced Usage
Custom helpers
helpers.js
:
; // Page title { if thispageTitle return thispageTitle; if thistitle if suffix === undefined suffix = ' — ' + this; return + suffix || ''; else return this; }
index.js
:
;; // ... let helpers = ...defaultHelpers ...customHelpers; // ... let pages = ; // ...
Template:
<%= @getPageTitle() %>
Custom tags
index.js
:
;; let renderMarkdown = ; // ...
Markdown source (on a separate line):
Markdown renderer tweaking
index.js
:
;; // Screenshots: /images/mac__shipit.png or /images/win__shipit.png { let m = text; if m return `<div class="screenshot screenshot_"></div>\n`; return `<p></p>\n`; } let renderMarkdown = ; // ...
Showcase
Changelog
The changelog can be found in the Changelog.md file.
Author
License
The MIT License, see the included License.md file.