Skip to content

Build Systems (Node.js)

September 29, 2023
June 11, 2015

Understanding Build Processes

javascript-pipeline
css-pipeline

TODO: add ~/web/nodejs/build
Jake: JavaScript build tool task runner for NodeJS

Source map

​Everything You Wanted to Know About JavaScript Source Maps | Scotch
Anatomy of source maps

npm

You can define npm scripts in package.json. npm will automatically resolve binaries in node_modules.
You can use shell pipe in the command. This works great is your toolchains support piping.
If you need cross-platform support (well, Windows support), consider using Vanilla JS.

scripts | npm Documentation
run-script | npm Documentation

Why we should stop using Grunt & Gulp
How to Use npm as a Build Tool
Why I Left Gulp and Grunt for npm Scripts — Free Code Camp — Medium
Choose: Grunt, Gulp, or npm?

Give Grunt the Boot! A Guide to Using npm as a Build Tool
Gulp is awesome, but do we really need it?
You don’t need Grunt — Medium with CLI replacements
You Might Not Need Gulp.js — Startups, Wanderlust, and Life Hacking — Medium
task automation with npm run

Using npm Scripts to Build an Asset Pipeline
open-cli-tools/concurrently: Run commands concurrently. Like npm run watch-js & npm run watch-less but better.
mysticatea/npm-run-all: A CLI tool to run multiple npm-scripts in parallel or sequential.

google/wireit: Wireit upgrades your npm scripts to make them smarter and more efficient.

Vanilla JS

If your toolchain expose Node.js API, you can write an Node.js app as your pipeline. This is better the other task runners as you have nothing more to learn other then JavaScript and the API of the toolchain you are using.

Node.js as a build script | Blog | Miller Medeiros
Node.js, Ant, Grunt and other build tools | Blog | Miller Medeiros

introducing ./task.js, THE new javascript task runner automation framework
Bevry News 2015 Weeks 34, 35, 36 — Bevry Blog

jprichardson/node-fs-extra: Node.js: extra methods for the fs object like copy(), remove(), mkdirs()
keithamus/hashmark: Take contents of a file (or stdin), and output as new file with a hash in the name
nicholaswyoung/revv

ShellJS

ShellJS portable Unix shell commands
nzakas/shelljs-nodecli easier to run binaries in node_modules, like npm scripts

Building JavaScript apps source

https://github.com/firebug/firebug/blob/master/extension/build.js
https://github.com/kjbekkelund/js-build/blob/master/make.js
https://github.com/madrobby/zepto/blob/master/make
https://github.com/mozilla/pdf.js/blob/master/make.js
https://github.com/gnab/remark/blob/develop/make.js

builder

builder
Formidable used to organize Victory ecosystem

Metalsmith

Metalsmith was advertised as a static site generator, but the pipeline and plugins allow it to be used as a build system.

Metalsmith

Grunt

Grunt: The JavaScript Task Runner
Plugins - Grunt: The JavaScript Task Runner
Grunt Tips and Tricks

bahmutov/grunty Run any grunt plugin as NPM script without Gruntfile.js

Gulp

gulp.js - the streaming build system
The Complete-Ish Guide to Upgrading to Gulp 4 | Joe Zim's JavaScript Blog
Automate Your Tasks Easily with Gulp.js | Scotch
Gulp Basics Course
Gulp, Grunt, Whatever

Learning Gulp - YouTube

Brunch

Brunch - ultra-fast HTML5 build tool
brunch/brunch-guide