browserify tools

This page lists various tools that either use browserify or add features to it.

Task runners

• grunt-browserify - Grunt task for node-browserify.
• broccoli-browserify - Browserify plugin for Broccoli.
• Using Gulp? There is a recipe.

Compiling for Development

There are two main ways that people like to recompile browserify bundles automatically as the files change. One way is to generate bundles on the fly attached to an existing web server. Another way is to run a standalone command or module that will only watch for changes and write to disk with the latest output.

Web Server Tools

• beefy a local development server designed to work with browserify which creates bundles on demand
• appup launch apps that use an express main server and an optional restify api server and bundle with browserify
• enchilada host your bundles as middleware via express or connect
• browserify-middleware host your bundles as middleware via express or connect
• sprockets-browserify Serve node modules though Sprockets using browserify
• connect-browserify provides yet another express/connect middleware for browserify which can rebuild a bundle automatically on source changes (uses watchify internally)
• bfydir is like beefy but different: you can run one server to bundle multiple *.js-files simultaneously (via watchify)
• amok serves your bundles with live editing capabilities

Standalone Tools

• watchify efficiently re-compile the bundle automatically when you edit files
• parcelify Output css or other bundles based on the browserify dependency graph.
• refreshify is like watchify, but has desktop notifications and live-reload built in

Compiler Pipeline

These tools fit somewhere into the pipeline of module-deps | insert-module-globals | browser-pack that browserify sets up internally or deal with module-deps json output or input directly. You can use these tools to build your own browserify more suited to your specific needs.

• module-deps - create json output from entry files that can be fed into browser-pack
• insert-module-globals - transform module-deps input to insert browser shims for Buffer, __filename, __dirname, and global
• browser-pack - generate a bundle of javascript from module-deps json input
• browser-unpack - create module-deps-formatted output from an existing bundle file
• factor-bundle - consume module-deps input, splitting out each entry file into a separate bundle and factoring out the modules held in common by multiple bundles
• intreq - transform require('string') to require(n) in a module-deps stream to save bytes

Bundle Tools

These tools accept a bundle file generated by browserify or browser-pack as input.

• exorcist pull the source map found inside a stream into an external .js.map file
• browser-unpack - create module-deps-formatted output from an existing bundle file
• derequire - replace require() calls with _dereq_() so that bundles can be required by browserify or similar static analysis tools again. This module was used in browserify --standalone pre v5.
• unpathify - compress require paths for better minification i.e. require('some/long/path') => require(1)
• disc - visualise the module tree of browserify project bundles and track down bloat.

Testing

• testling run testling-ci tests locally.
• zuul run your test suite in many browsers without having them installed locally
• proxyquireify proxy browserify's require in order to override dependencies while testing
• mochify TDD for browserified code with Mocha, PhantomJS and WebDriver
• karma-bro bundle test files via browserify when being run with karma

Refactoring

• browserify-ftw refactor requirejs AMD projects to work with browserify

Other tools

• cartero full asset pipeline based on commonjs and browserify.
• xcss plugin for browserify collects all require() calls which reference stylesheets and bundle them into a separate CSS bundle.

Transform Helpers

• browserify-transform-tools a library of handy functions for loading configuration and generating transforms