https://github.com/hughsk/glslify-live
A browserify transform that transparently enables live reloading of your shaders when using glslify.
https://github.com/hughsk/glslify-live
Last synced: 3 months ago
JSON representation
A browserify transform that transparently enables live reloading of your shaders when using glslify.
- Host: GitHub
- URL: https://github.com/hughsk/glslify-live
- Owner: hughsk
- License: other
- Created: 2014-06-03T01:07:48.000Z (about 11 years ago)
- Default Branch: master
- Last Pushed: 2016-10-06T02:54:53.000Z (over 8 years ago)
- Last Synced: 2024-04-13T20:21:57.199Z (about 1 year ago)
- Language: JavaScript
- Size: 15.6 KB
- Stars: 41
- Watchers: 7
- Forks: 6
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# glslify-live [](http://github.com/badges/stability-badges)
A [browserify](http://browserify.org/) transform that transparently enables
live reloading of your shaders when using
[glslify](http://github.com/chrisdickinson/glslify).
## Usage
[](https://nodei.co/npm/glslify-live/)
After installing `glslify-live`, run this from your project root to start up
the live reloading server:
``` bash
node_modules/.bin/glslify-live
```
If you're running it from a `package.json` script, you can just do:
``` bash
glslify-live
```
Once that's running, you can simply include the `glslify-live` transform
*before* `glslify` when you're bundling with browserify. In the commandline:
``` bash
browserify -t glslify-live -t glslify
```
Or through browserify's JavaScript API:
``` javascript
var browserify = require('browserify')
var fs = require('fs')
var output = fs.createWriteStream('bundle.js')
var br = browserify('client.js')
br.transform('glslify-live')
br.transform('glslify')
br.bundle().pipe(output)
```
### 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 listen to
the update event:
``` javascript
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!
## License
MIT. See [LICENSE.md](http://github.com/hughsk/glslify-live/blob/master/LICENSE.md) for details.