Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

browserify v2 middleware

In development I use both Coffeescript and Browserify middleware on my Express server to deliver my client side JS like so:

app.use browserify mount: '/client.js', entry: './client.coffee', watch: yes

Today I was upgrading my dependencies and noticed this on the browserify v2 website:

One of the worst ideas in browserify, the ad-hoc http server middleware to host bundles is finally gone.

Default support for coffee-script is gone. You can still use coffee script in your program, you'll just need to either compile to js or hook the source transformation into the bundle pipeline yourself.

Remember that if you disagree with these cuts which I expect many people will, with the v2 refactoring it's much easier to roll your own vision of how browserify should be using the underlying new libraries as a starting place.

Fair enough.

Only thing is, I have read the docs for the new API and I'm at a bit of a loss how to actually go about implementing my own middleware. In fact I can't even get a basic standalone example working using browserify.add() and browserify.bundle(), let alone as express middleware.

I could just continue to use v1 but as this project is still in development I'd like to keep my dependencies up to date. Any suggestions greatly appreciated.

Update:

I've got this far:

browserify = require 'browserify'
coffee = require 'coffee-script'
through = require 'through'

app.get '/client.js', (req, res) ->
  b = browserify()
  b.add './client.coffee'
  b.transform (file) ->
    write = (buf) ->
      data += buf
    end = ->
      @queue coffee.compile(data)
      @queue null
    data = ''
    return through(write, end)
  b.bundle {}, (err, src) ->
    res.send src

This works, except where I used to say require './module' it appears I now have to require './module.coffee'. This isn't really ideal, I don't want to have to update every require in my app.

like image 458
captainclam Avatar asked Jun 06 '26 21:06

captainclam


2 Answers

I got this working:

browserify = require('browserify-middleware')
coffeeify = require('coffeeify')
express = require('express')

app = express()

browserify.settings('transform', [coffeeify])

app.get('/client.coffee', browserify('./client.coffee'));

app.listen(3230);

But it may not solve the needing to require("X.coffee") problem.

like image 115
Arelius Avatar answered Jun 10 '26 04:06

Arelius


If you like grunt for development, I've developed this task : https://github.com/amiorin/grunt-watchify

It caches the dependencies and watches the filesystem. Because of this the build is very fast. You can use it with grunt-contrib-watch and grunt-contrib-connect or alone. You can find a Gruntfile.js example in the github repository.

If you don't use grunt, you can use the original watchify from @substack : https://github.com/substack/watchify

You can use coffee of course with the transform.

like image 22
Alberto Miorin Avatar answered Jun 10 '26 04:06

Alberto Miorin



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!