Sage's Gulp workflow with Browserify, Browserify Hot Module Reloading

I know the next version of Sage will be using Webpack for asset compilation, but in an attempt to learn, I added Browserify with hot module reloading to my Gulpfile.

It hooks into the Sage (v.8) workflow, so it includes asset revisioning, sourcemaps, etc.

Here’s the gist, if you’re interested:

It includes Vueify since I’m building with Vue, but you could use any other HMR-compatible transform you want.

I hope this helps somebody.

PS: The only thing I couldn’t get working was HTTPS using browserify-hmr. Using a new self-signed certificate, I kept getting connection errors in Chrome, so I’ve disabled SSL on my local Trellis for now.

browserify-hmr uses socket.io; I don’t know if there’s something wrong with the HMR plugin or socket.io itself, but something was funky about it and Chrome always rejected the connection from socket. (I suspect it’s a problem with browserify-hmr.)

2 Likes