node package manager
Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »


glslify-live experimental

A browserify transform that transparently enables live reloading of your shaders when using glslify.



After installing glslify-live, run this from your project root to start up the live reloading server:


If you're running it from a package.json script, you can just do:


Once that's running, you can simply include the glslify-live transform before glslify when you're bundling with browserify. In the commandline:

browserify -t glslify-live -t glslify

Or through browserify's JavaScript API:

var browserify = require('browserify')
var fs = require('fs')
var output = fs.createWriteStream('bundle.js')
var br = browserify('client.js')

Detecting File Changes

You might want to respond to these automatic updates, especially considering that they may result in changing the values of your uniform/attribute variables.

In that case, you can simply require this module in your code and list to the update event:

var live = require('glslify-live')
live.on('update', function(filename, shaderInstance) {
  // do things here 

If you're not applying the transform, all that you're loading up is an empty EventEmitter so it shouldn't be an issue including it in your code. Enjoy!


MIT. See for details.