uify

work in progress

the end of javascript fatigue: an opinionated set of tools for front-end apps

# npm install -g ahdinosaur/uify

what

you want to build a front-end app, but which tool should you use?

i've written, copied, and re-written my front-end tools over and over again. i've learned heaps along the journey and am settling into preferred patterns.

here's a grab bag of documented tools to get you building apps again. :)

features

• generate new projects with ease
• uses the cutting-edge browserify compiler
• exposes your entry file as require('app')
• flattens configuration from many sources as require('config')
• applies es2020, a transpiler for the better subset of ES6
• provides source maps for improved debugging
• live reloads your app whenever you change a file
• applies compression when in minify mode

usage

uify <subcommand> [options]
  --version, -v         print version
  --help, -h            print help

uify[subcommand](options, callback)

create

TODO create new uify project.

uify create my-super-cool-project
? Version: (0.0.0) 1.0.0
? Description: () Some description of your app
? License: (Use arrow keys)
> Apache-2.0
  ISC
  AGPL-3.0
? App directory: (app)
? Build directory: (build)

uify.create(options, callback)

start

live development server for your front-end app.

in your JavaScript code,

• require('app') will return the entry module.
• require('config') will return your config

uify start [options]
  --entry, -e           path to the entry source file for browserify (default: ".")
  --output, -o          path to the output directory where files are built to (default: "build")
  --plugin, -p          name or path to any additional browserify plugin(s) (default: [])

uify.start(options, callback)

deploy

TODO build and git push to a remote server, like Github pages.

uify deploy

uify.deploy(options, callback)

build

build project with browserify.

if watch enabled, use watchify.

in your JavaScript code,

• require('app') will return the entry module.
• require('config') will return your config

uify build [options]
  --entry, -e           path to the entry source file for browserify (default: ".")
  --output, -o          path to the output directory where files are built to (default: "build")
  --watch, -w           watch source tree and rebuild using watchify (default: false)
  --minify, -m          compress bundle using uglifyify, exorcist, and bundle-collapser (default: false)
  --plugin, -p          name or path to any additional browserify plugin(s) (default: [])

uify.build(options, callback)

build accepts the following options:

• entry (e): entry source file that browserify uses to recursively walk require'd modules, resulting in a source tree. (default: resolved entry file of current working directory.)
• output (o): output directory where files are built to. (default: directory of entry source file.)
• watch (w): watch source tree and rebuild using watchify. (default: false)
• minify (m): compress bundle using uglifyify, exorcist, and bundle-collapser. (default: false)

callback(err) is called if bundle process fails.

callback(null, stats) is called on build (or re-build) with a stats object:

• time: milliseconds to bundle
• bytes: bytes in bundle

serve

serve static assets with serve-static.

serve accepts the following options:

• directory (d): directory to serve
• watch (w): inject livereload script into html with inject-lr-script
• minify (m): compress assets using compression

uify serve
  --directory, -d       directory to serve static assets (default: "build")
  --port, -p            port of http server (default: 5000)
  --watch, -w           inject LiveReload script into html files (default: false)
  --minify, -m          compress assets with gzip (default: false)

uify.serve(options, callback)

callback(err) is called if bundle process fails.

callback(null, server) is called with http.Server instance once server is listening

live

see watch-lr docs

push

TODO git push to a remote server (like GitHub pages).

uify push

uify.push(options, callback)

inspiration

• slush-pages
• bundleify
• bankai
• browserify for webpack users

license

The Apache License

Copyright © 2016 Michael Williams

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.