Configuring Your Armadillo - Snugug/gulp-armadillo GitHub Wiki

Your Armadillo is pretty smart when it gets to you, but isn't too persnickety. In fact, it accepts all kinds of different configurations! Its default configuration is the most common one and the one that its Yeoman generator builds out, but you can change it if you'd like. Your Armadillo uses the config module to handle configuration. Your Armadillo needs some configuration before its ready to go, so be sure to configure it before setting off.

Make a Config File

The easiest way to configure your Armadillo is to create a config/default.js file with the following:

'use strict';

const armadillo = require('gulp-armadillo/config');

module.exports = armadillo;

What this will do is take Armadillo's default configuration and make it yours! If there's anything you'd like to change, you now have an object to work with.

Different Settings and What They Do

There are a bunch of different top-level settings for you to play with:

Individual Config

  • rollup - Options passed to rollup.js to compile your JavaScript!
  • babel - Options passed to gulp-babel (which will run after rollup.js)
  • sass - Options passed to gulp-sass to compile your Sass
  • imagemin - Options passed to gulp-imagemin to optimize your images
  • critical - Options passed to critical to inline critical CSS during a production build
  • htmlmin - Options passed to gulp-htmlmin to minify HTML during a production build
  • publish - Options passed to gulp-gh-pages to publish during a deploy

Armadillo Config

  • folders - The folders Armadillo looks for to read and write files
  • sourcemaps - Settings for sourcemaps, whether to enable them and what directory to write them to (relative to file output)
  • sw - Settings for configuring automatic Service Worker generation (as powered by sw-precache).
    • sw.file - String file name for service worker
    • sw.extensions - Array of string file extensions (without leading .) to cache
    • sw.browser.include - Boolean whether or not to automatically include service worker registration in rendered JavaScript file
    • sw.browser.notify - Boolean whether or not to display to the user about service worker registration/update (a little experimental at the moment)
    • sw.browser.updated - String to use describing that new or updated content is available from the service worker
    • sw.browser.offline - String to use describing that a user has gone offline
  • tasks - Gulp tasks to run for each given key task. Each task is an array with a combination of strings (for single tasks) and arrays of strings (for parallel tasks), with each grouping being run in series.
  • replace - Supported string replacements to be run. Each replace has a find and a replace option to be set to strings
    • base - Replaces the contents of <base href="${find}"> to <base href="${replace}">. By default, only runs on deployments. Useful for developing with absolute paths locally and on GitHub Pages and allowing GitHub Pages to find the correct URLs. Do not include ${}