Simple snippet-based static HTML build system that lets you reuse code snippets with simple variables and conditional inclusion.
npm install sniplicity
Simple comment-based static HTML build system that lets you reuse code snippets with simple variables and conditional inclusion. Great for building static websites with less hassle.
- static page builder
- all commands are embedded in HTML comments
- re-use snippets of HTML throughout your project
- use variables to replace values and control your build
- include other files
!Logo
Globally
``sh`
sudo npm install -g sniplicity
or locally
`sh`
npm install -s sniplicity
`sh`
git clone https://github.com/davebalmer/sniplicity.git sniplicity
cd sniplicity
npm i
Globaly:
`sh`
sniplicity -i in_dir -o out_dir
or locally:
`sh`
node sniplicity.js -i in_dir -o out_dir
Currently sniplicity only supports the concept of a source (in) directory and a destination (out) directory, which it uses to:
1. read all html, htm and txt files found in the in directoryout
2. process them
3. save compiled files to the directory
In the future, sniplicity should also accept single files to process to make it compatible with other build tools.
| Flag | Short | Purpose |
|------|-------|---------|
| --in | -i | Input (source) directory |
| --out | -o | Output (destination) directory |
| --watch | -w | Watch the in directory and your project when one or more of them change.
| --verbose | -v | Increase the sniplicity inner-monologue. |
| --help | -h | Help! |
All sniplicity commands are embedded in HTML comments, so they will not intefere with your favorite editor. Here are some examples:
`html
`
and copySnippets work like a text editor clipboard. Use cut, copy and paste to define and use snippets. You may cut or copy them anywhere in your project and they can be pasted anywhere in any file (even the one they were defined in).
`html
Nav: A, B, C
(will show up twice because we copied it)
Copyright © 2016 A, B, C
(only shows up once because we cut it)
Both
and copy make snippets. The
difference is copy will copy the snippet while, you guessed it,
cut will cut it out of the current file. When in doubt, use copy.Pasting snippets with
pasteTo use any snippet, just
it by name in any file in your project.`html
`Assigning variables with
These are more like constants, and you use
to define them. Their values are available only inside the file where you set them, and the last declaration in a file will have the value used for replacement.`html
`Using variables with
marksWith any variable (or default variable), you may include the value by using a simple mark anywhere in your file with the name of the variable surrounded by two dashes.
`html
My title is --title--
`Make global default variables with
You may set global default values for variables with
. If you use set with the same variable name in a given file, the default value will be overwritten inside that file and return to its default value for other files.`html
`You may also use these defaults as a form of global variable which you can use anywhere in your project.
Make conditional builds using
and endifYou can test a variable to decide if you want to include or exclude
a section. These will work inside snippets as well.
html
test is truthy!
test is falsy!
`Include other content files using
Right now, sniplicity copies the file contents verbatum. Later there may
be filters (eg. markdown, jade).
html
`About
This build tool scratches an itch I had for a static HTML builder that could move easily from single-page design prototype to multi-page production site with incremental and minimal automation effort. It is a conceptual reboot of a tool I designed and wrote back in my
Sniplicity is not a template engine so much as a tool that lets you "short-cut" the more redundant efforts of producing hand-coded HTML by using code snippets, simple variable substitution, and conditional code and file inclusion.
That said, it's designed to be completely compatible with template tools like Jade, Backbone, Handlebars, LESS, Stylus and the like. It just allows you to automate your static HTML file building.
The features and syntax for the first release are set, but more extensive error checking is a must. I also want to make the features that are there smarter and more flexible.
Yes! Let me know of any errors or feature requests in the issue tracker. If you want to take a stab at making improvements, please do. Nothing special is required, just clone this repo and start coding. I'm open to all good pull requests.
Copyright (C) 2016 Dave Balmer
Using the MIT License (MIT)