Skip to content

Saturate/gulp-water

master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
 
 
 
 
 
 

gulp-water Build Status Dependencies NPM Version

Static Website Generator, for gulpjs.

What is water?

Enables you yo take some content and grow it into a site. It does not optimize anything, it just makes Markdown into HTML. It uses a special header in each file to get meta-data about the current file. For optimizing you could plug Water into a Gulp pipe, that could minify assets and such.

Installation

npm install gulp-water --save

Basic Usage

You can take a look at my AKJ.IO repo for a full usage example, with optimizations ect.

const gulp = require('gulp');
const less = require('gulp-water');

function generate () {
	return new water({ source: './content/**/*.md' })
		.pipe(gulp.dest('./dist');
}

exports.generate = generate;

The content structure looks like this right now. All posts & pages have their own folder, that contains all the needed assets.

content
└───pages
│   └───about-me
│       │   about-me.md
│       │   awesome-picture-of-me.jpg
│       │   ...
│
└───posts
│   └───an-awesome-blog-post
│       │   an-awesome-blog-post.md
│       │   awesome-picture-of-me.jpg
│       │   ...

This is not the normal way where you would have a /images/ folder, but it makes it a lot easier to control content, think components but for pages and blog posts. It makes it easy to update a picture, or delete a blog post about worrying about missing images, and a images folder that contains a lot of junk.

Developing

A nifty trick is to install nodemon. When that is done, you can run the following command in the project using gulp-water.

nodemon --exec "gulp dev" --watch ./gulpfile.js --watch D:\Path\To\GitHub\gulp-water

This will watch for file changes both in the gulpfile in the current project, and in gulp-water allowing for much faster development.

License

Copyright 2016-2017 - Allan Kimmer Jensen

About

Static Website Generator, for gulpjs.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published