Email builder

newsletter_builder.js

// http://stackoverflow.com/questions/1335851/what-does-use-strict-do-in-javascript-and-what-is-the-reasoning-behind-it
'use strict';

const del       = require('del');
const gulp      = require('gulp');

// Gulp Plugins

const sass      = require('gulp-sass');         // https://github.com/dlmanning/gulp-sass
const csso      = require('gulp-csso');         // https://github.com/ben-eb/gulp-csso
const changed   = require('gulp-changed');      // https://github.com/sindresorhus/gulp-changed
const prefixer  = require('gulp-autoprefixer'); // https://github.com/sindresorhus/gulp-autoprefixer
const include   = require('gulp-file-include'); // https://www.npmjs.com/package/gulp-file-include
const htmlmin   = require('gulp-htmlmin');      // https://github.com/jonschlinkert/gulp-htmlmin
const webserver = require('gulp-webserver');    // https://github.com/schickling/gulp-webserver
const sequence  = require('gulp-sequence')      // https://github.com/teambition/gulp-sequence
const coffee    = require('gulp-coffee');       // https://github.com/contra/gulp-coffee
const minify    = require('gulp-minify');       // https://github.com/hustxiaoc/gulp-minify
const imagemin  = require('gulp-imagemin');     // https://github.com/sindresorhus/gulp-imagemin
const plumber   = require('gulp-plumber');      // https://github.com/floatdrop/gulp-plumber
const ghPages   = require('gulp-gh-pages');     // https://github.com/shinnn/gulp-gh-pages

const CWD = process.cwd() + "/";

// Configuration

const PROJECT = {
  dest: CWD +'dist/',
  src:  CWD +'src/',
  host: 'localhost',
  port: 8000
}

const VIEWS = {
  src:   PROJECT.src + "views/",
  dest:  PROJECT.dest,
  files: PROJECT.src + "views/**/[^_]*.html"
}

const STYLES = {
  src:   PROJECT.src  + "styles/",
  dest:  PROJECT.dest + "css/",
  files: PROJECT.src  + "styles/**/*.scss"
}

const COFFEES = {
  src:   PROJECT.src  + "coffee/",
  dest:  PROJECT.dest + "js/",
  files: PROJECT.src  + "coffee/**/*.coffee"
}

const ASSETS = {
  src:   PROJECT.src  + "assets/",
  dest:  PROJECT.dest + "assets/",
  files: PROJECT.src  + "assets/**/*.+(gif|jpg|jpeg|png|svg)"
}

// Gulp Tasks

gulp.task('build',  sequence(['html-compile','css-compile','js-compile','assets-copy','files']));
gulp.task('serve',  sequence(['html','css','js','assets','files']));
gulp.task('deploy', sequence('serve','github-deploy'));

gulp.task('html',  sequence('html-compile','html-minify'));
gulp.task('css',   sequence('css-compile','css-prefix','css-minify'));
gulp.task('js',    sequence('js-compile','js-minify'));
gulp.task('assets',sequence('assets-copy','assets-minify'));
gulp.task('files', sequence('copy-files','copy-clean'));

// Running a server

gulp.task('default', function () {
  gulp.src(PROJECT.dest)
    .pipe(webserver({
      host: PROJECT.host,
      port: PROJECT.port,
      livereload: true,
      directoryListing: { path: VIEWS.dest },
      open: true
  }));
});

// Watching for file changes. Relevant only when running server

gulp.task('watch', function () {
  gulp.watch(VIEWS.files,  ['html-compile']);
  gulp.watch(STYLES.files, ['css-compile']);
  gulp.watch(COFFEES.files,['js-compile']);
  gulp.watch(ASSETS.files, ['assets-copy']);
});

// Cleaning latest build

gulp.task('clean', function() {
  return del([PROJECT.dest]);
});

// Task expects that you are currently in a repository. Once you login it will
// create a GitHub Pages branch (if its not created) and push the content
// of current build to it.

gulp.task('github-deploy', function() {
  // https://github.com/shinnn/gulp-gh-pages
  return gulp.src(PROJECT.dest + "**/*")
    .pipe(plumber())
    .pipe(ghPages());
});

// Copy all the files

gulp.task('copy-files',function(){
  return gulp.src([PROJECT.src + "**/*",
             "!" + VIEWS.src   + "**/*",
             "!" + STYLES.src  + "**/*",
             "!" + COFFEES.src + "**/*",
             "!" + ASSETS.src  + "**/*"])
    .pipe(gulp.dest(PROJECT.dest));
});

// Delete all the unnecessary created stuff

gulp.task('copy-clean', function(){
  return del([PROJECT.dest + "views",
              PROJECT.dest + "styles",
              PROJECT.dest + "coffee",
              PROJECT.dest + "assets"]);
});

// HTML compiling and minification
// It doesn't actually compile anything, just connects files

gulp.task('html-compile', function() {
  gulp.src(VIEWS.files)
    .pipe(plumber())
    .pipe(changed(VIEWS.dest))
    .pipe(include({
      prefix: '@@',
      basepath: VIEWS.src
    }))
    .pipe(gulp.dest(VIEWS.dest));
});

gulp.task('html-minify', function() {
  return gulp.src(VIEWS.dest + "**/*.html")
    .pipe(plumber())
    .pipe(htmlmin({collapseWhitespace: true}))
    .pipe(gulp.dest(VIEWS.dest));
});

// Coffee to JS

gulp.task('js-compile', function() {
  // https://github.com/contra/gulp-coffee
  // Compiling coffee into JS
  gulp.src(COFFEES.files)
    .pipe(plumber())
    .pipe(changed(COFFEES.dest, {extension: '.js'}))
    .pipe(coffee({bare: true}))
    .pipe(gulp.dest(COFFEES.dest));
});

gulp.task('js-minify', function() {
  // https://github.com/terinjokes/gulp-uglify
  // Removes all the unnecessary stuff
  gulp.src(COFFEES.dest + "**/*.js")
    .pipe(minify())
    .pipe(gulp.dest(COFFEES.dest));
});

// CSS compiling, optimization and minification

gulp.task('css-compile', function () {
  return gulp.src(STYLES.src + "**/[^_]*.scss")
    .pipe(plumber())
    .pipe(changed(STYLES.dest, {extension: '.css'}))
    // Can be easily replaced with
    // https://www.npmjs.com/package/gulp-less
    .pipe(sass().on('error', sass.logError))
    .pipe(gulp.dest(STYLES.dest));
});

gulp.task('css-prefix', function () {
  // https://github.com/postcss/autoprefixer
  // Adds prefixes support for latest 2 versions of CSS
  return gulp.src(STYLES.dest + "*.css")
    .pipe(plumber())
    .pipe(prefixer({
        browsers: ['last 2 versions'],
        cascade: false
    }))
    .pipe(gulp.dest(STYLES.dest));
});

gulp.task('css-minify', function () {
  // https://github.com/css/csso
  // Very powrful CSS Optimizer
  return gulp.src(STYLES.dest + "*.css")
    .pipe(plumber())
    .pipe(csso())
    .pipe(gulp.dest(STYLES.dest));
});

// Copy all the images

gulp.task('assets-copy', function() {
  return gulp.src(ASSETS.files)
    .pipe(plumber())
    .pipe(gulp.dest(ASSETS.dest));
});

gulp.task('assets-minify', function() {
  // https://github.com/sindresorhus/gulp-imagemin
  // Minifying images up to by 90%
  gulp.src(ASSETS.dest + '/**/*.+(jpg|jpeg|png|svg)')
    .pipe(plumber())
    .pipe(imagemin())
    .pipe(gulp.dest(ASSETS.dest))
});

package.json

{
  "name": "glue",
  "version": "1.0.0",
  "description": "Personal static site generator",
  "main": "gulpfile.js",
  "devDependencies": {
    "del": "^2.2.2",
    "gulp": "^4.0.0",
    "gulp-autoprefixer": "^4.0.0",
    "gulp-changed": "^3.1.0",
    "gulp-coffee": "^2.3.4",
    "gulp-csso": "^3.0.0",
    "gulp-file-include": "^1.1.0",
    "gulp-gh-pages": "^0.5.4",
    "gulp-htmlmin": "^3.0.0",
    "gulp-imagemin": "^4.1.0",
    "gulp-load-plugins": "^1.5.0",
    "gulp-minify": "^1.0.0",
    "gulp-plumber": "^1.1.0",
    "gulp-sass": "^4.0.1",
    "gulp-sequence": "^0.4.6",
    "gulp-uncss": "^1.0.6",
    "gulp-webserver": "^0.9.1",
    "hoek": "^5.0.3",
    "mkdirp": "^0.5.1"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/rojcyk/glue.git"
  },
  "author": "Denis Rojcyk",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/rojcyk/glue/issues"
  },
  "homepage": "https://github.com/rojcyk/glue#readme"
}