Noah is a boilerplate for compiling front-end web apps using NPM build scripts.

• Install
• Tasks
• Usage
• Dependencies

• Fewer dependencies (no need for Grunt/Gulp, and their respective task wrappers)
• Speed (by the time you click from your text editor to your browser, your code has already been recompiled and injected into the browser)
• More Total control over your build steps
• Future proof (protect your project from time-travellers)

Compile, test and depoly code on the fly as you develop

• Includes everything required to get going off the bat
• Adaptable/scalable to suit your project
• Built for the modern front-end developer
• Favours API usage over CLI wrappers

• CSS/Sass lint | autoprefix | compile
• JS concatenate | uglify | lint | unit test
• Assemble/Handlebars
• Browsersync + watching & live reload
• Git pre-commit hook - never commit bad code again
• General tasks

All plugins use pure Node.js bindings, so the only things required are:

• Node.js
• NPM

Noah is a boilerplate rather than a dependency, so you may wish to fork this repo for your starting point. Noah is still available as an npm package, however:

npm install noah-npm

Run specific tasks from above in a specific order

Most executable tasks have their own .js file * (found in the /build/tasks/ directory) which is where your project specific details are passed for that task. Executing a task typically looks something like:

NOAH.task({
    option : value
});

The corresponding entry in package.json would look something like:

"scripts": {
    "yourTask": "node ./build/tasks/task.js"
}

And is executed from the command line by:

npm run yourTask

* Currently the jshint and scsslint tasks are executed via their CLI interface, as opposed to their API, pending future investigation.

Each task has a default, basic-usage example, which will likely need to be modified for your project. Ensure you go through each task and check the options reflect your project's structure. For example, if your project requires two CSS files to be compiled, you may have something like this in your /build/tasks/sass.js file:

// Theme
NOAH.sass({
    src : 'assets/styles/themes/internal.scss',
    dest: 'public/styles/internal.css'
});

// Print
NOAH.sass({
    src : 'assets/styles/themes/print.scss',
    dest: 'public/styles/print.css'
});

No matter how many entries you have, they will all be executed when running npm run sass from the command line.

Noah installs the following NPM dependencies:

"dependencies": {
    "assemble"                : "^0.17.1",
    "autoprefixer"            : "^6.5.1",
    "browser-sync"            : "^2.18.5",
    "chai"                    : "^3.5.0",
    "fs-extra"                : "^0.30.0",
    "gulp-extname"            : "^0.2.2",
    "handlebars"              : "^4.0.5",
    "handlebars-helper-repeat": "^0.3.1",
    "handlebars-helpers"      : "^0.7.5",
    "jshint"                  : "^2.9.4",
    "jshint-stylish"          : "^2.2.1",
    "karma"                   : "^1.3.0",
    "karma-chai-plugins"      : "^0.8.0",
    "karma-mocha"             : "^1.2.0",
    "karma-mocha-reporter"    : "^2.2.0",
    "karma-phantomjs-launcher": "^1.0.2",
    "mkdirp"                  : "^0.5.1",
    "mocha"                   : "^3.1.2",
    "mz"                      : "^2.4.0",
    "node-sass"               : "^3.10.1",
    "npm-run-all"             : "^3.1.1",
    "postcss"                 : "^5.2.5",
    "pre-commit"              : "^1.1.3",
    "sass-lint"               : "^1.9.1",
    "uglify-js"               : "^2.7.4"
  }

Whilst Noah comes with everything you might need to get going, you still may wish to expand upon the default tasks. Every new task will need its own .js task file configured, which, depending on the plugin, may or may not be simple to do.

Noah comes with some useful additional tools to facilitate development of new tasks.

This helper module is used to get an array of files from a specified directory.

var filePaths = require('./file-paths').filePaths;
var components = filePaths('assets/_js/components/'); // returns all files in this directory