Giter Site home page Giter Site logo

browserify-crawl's Introduction

browserify-crawl

Recursively crawls a directory and browserifies, watches, source-maps, displays errors, minifies, and gzips multiple files based on filename matching. This is a pre-configured utility for developer convenience that is still very customizable.

const bcrawl = require('browserify-crawl')
const emitter = bcrawl({
   fileName: 'page.js',
   source: 'client/js',
   dest: 'public/js',
   watch: true,
   compress: true,
   browserify: {
     transforms: ['babelify']
   }
})

console.log('finding files')
emitter.on('build', (files) => console.log('finished initial build of', files.length, 'files'))
emitter.on('update', (file) => console.log('detected update on', file))
emitter.on('compile', (file) => console.log('compiled', file))
emitter.on('compress', (file) => console.log('compressed', file))
emitter.on('error', (err) => console.log('error', err.message))

The above will find all files named page.js in the client/js directory, even nested ones. It will then recreate a mirror directory structure in public/js with all the compiled files.

For example, if you have client/js/page.js and client/js/dashboard/page.js, then the compiler will create public/js/page.js and public/js/dashboard/page.js, which will be the built versions of the files. The compiler will also create public/js/page.js.map, public/js/page.js.gz, public/js/dashboard/page.js.map, and public/js/dashboard/page.js.gz.

bcrawl(options)

The options object can have these properties:

  • source: path of the input directory containing all your mainfiles (which may be in nested directories). Required.
  • dest: path of your output directory, typically public/js, dest, etc. Required.
  • fileName: name of the main-file(s) that you want to compile. Defaults to page.js. These are the root files that you actually want to include in your html in a script element.
  • browserify: an object of browserify options from the browserify api
  • watch: whether to run watchify on each file to recompile on any changes
  • compress: whether to uglify & gzip the compiled file (slower)
  • unassertify: whether to run unassertify (slower)
  • commonShakeify: whether to run common-shakeify (slower)
  • uglifyify: whether to run uglifyify (slower)

The return value is an event emitter that allows you to listen to the following events:

  • compile: a file has finished compling. Callback receives the full file path.
  • build: the full set of files have finished the initial build. Callback receives an array of all file paths
  • update: a file has been updated but not yet compiled
  • compress: a file has finished being minified and gzipped
  • error: an error has been caught, most likely a browserify parse error

Sample development watcher

const bcrawl = require('browserify-crawl')

const emitter = bcrawl({
  source: process.argv[2] || './client/js',
  dest: './public/client/js',
  compress: false,
  watch: true,
  fileName: 'page.js',
  browserify: {
    debug: true,
    paths: ['./client'],
    insertGlobals: true // minor speed-up
  }
})

const logTime = x => console.log(`[${new Date().toLocaleTimeString()}]`, x)
const time = new Date()
logTime('( ゚ヮ゚) compiling all files')
emitter.on('build', (files)  => logTime('(° ͜ʖ °) finished building ' + files + ' files in ' + (new Date() - time) / 1000 + ' seconds... now watching for changes'))
emitter.on('compile', (file) => logTime('compiled ' + file))
emitter.on('update', (file)  => logTime('updated  ' + file))
emitter.on('error', (err)  => logTime('error  ' + err.message))

Sample production builder

const bcrawl = require('browserify-crawl')

const emitter = bcrawl({
  source: process.argv[2] || './client/js',
  dest: './public/client/js',
  compress: true,
  watch: false,
  fileName: 'page.js',
  browserify: {
    transform: 'es2040',
    paths: ['./client']
  }
})

const logTime = x => console.log(`[${new Date().toLocaleTimeString()}]`, x)
const time = new Date()
logTime('( ゚ヮ゚) compiling all files')
emitter.on('build', (files)  => logTime('(° ͜ʖ °) finished building ' + files + ' files in ' + (new Date() - time) / 1000 + ' seconds!'))
emitter.on('compile', (file) => logTime('compiled ' + file))
emitter.on('error', (err)  => logTime('error  ' + err.message))

browserify-crawl's People

Contributors

jayrbolton avatar yutakahoulette avatar

Stargazers

 avatar  avatar  avatar

Watchers

 avatar  avatar

browserify-crawl's Issues

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.