browserify scripts

February 2017 · 2 minute read

setting up browserify/watchify/*-ify over and over again can get uhh, tedious.

/dev

#!/bin/bash

cleanup() {
    rm src/bundle.js*
}

trap cleanup EXIT &&

watchify \
  -d \
  -v \
  -t [ envify --NODE_ENV dev ] \
  -t babelify $1 \
  -o 'exorcist src/bundle.js.map > src/bundle.js'

Usage:

$ ./dev entry.js

$ tree src/
src/
├── bundle.js
└── bundle.js.map

/dist

#!/bin/bash

# clean
rm dist/*

# build
./node_modules/.bin/browserifyinc \
  --cachefile .cache/browserify-cache.json \
  -t [ envify --NODE_ENV production ] \
  -t [ rollupify --config .rollup.conf.js ] \
  -t babelify \
  -g unassertify \
  -g uglifyify \
  $1 \
  | bundle-collapser \
  | uglifyjs -mc warnings=false,drop_console=true \
  | optimize-js > dist/$2.js

# rev
mv dist/$2.js dist/$2-$(md5 -q dist/$2.js | head -c10).js
// .rollup.conf.js (silences silly warnings during our dist build)
module.exports = { onwarn: function () { /** noop **/ } }

Usage:

# pass output filename w/o extension
$ ./dist entry.js out

$ tree dist/
dist/
└── out-a1c3a070e4.js