Backbone.history.start() # see index.coffee - error

_view.coffee

class exports.RootView extends Backbone.View
  el: $ '#container'
  template: '_.jade'

  initialize: ->
    _.bindAll @render

  render: ->
    $(@el).empty()
    $(@el).append jadeify @template
    # console.log('root view rendered')

app.coffee

# a piece of browserified express app

# ...

browserify = require 'browserify'
jadeify = require 'jadeify'
bundle = browserify
  require:  [ 'underscore'
            , 'underscore.string'
            , 'backbone'
            , {jquery: 'jquery-browserify'}
            ]
  entry: ["#{__dirname}/app/index.coffee"]
bundle.use jadeify "#{__dirname}/app/templates",
  watch: true
  extension: '.jade'

# ...

index.coffee

window._ = require "underscore"
window._.mixin require "underscore.string"
require "./helpers.coffee" # = _.mixin(s)

window.Backbone = require "backbone"
window.jadeify = require "jadeify"

window.onload = ->
  # Backbone app bootstrapping
  window.app =
    models: {}
    collections: {}
    views: {}
    initialize: ->
      this.views.home = new (require './views/_view').RootView()
      this.router = new (require('./router').ChartraRouter)() # last (it renders upon instantiation)
      # app.router.navigate 'home', true if Backbone.history.getFragment() is ''
  app.initialize()
  # console.log "#" + Backbone.history.getFragment() # ok
  # Backbone.history.start() # Uncaught TypeError: undefined is not a function
  # {root: '/', pushState: true, silent: true}

# The document is in copletely ready state.
if window.document.readyState is 'complete'
  window.onload()

router.coffee

class exports.ChartraRouter extends Backbone.Router
  routes:
    '': "home"
    blank: "blank"
  app: window.app

  initialize: ->
    this.navigate '', true # @home()

  # the it
  home: ->
    @app.views.home.render()

  # to illustrate Backbone.history #fail
  blank: ->
    $('#container').empty()
    $('#container').text('blank')

Any luck/feedback on this issue yet?

Yes, actually. You need to first 'npm install jquery', then modify Backbone.js to 'require('jquery')' as in line 35 here: https://github.com/Morriz/backbone-everywhere/blob/master/node_modules/backbone/backbone.js

from this repo: https://github.com/Morriz/backbone-everywhere

Thanks for the pointers. We solved it by patching backbone.js and then using a custom npm module and aliasing that inside browserify. Works like a charm.

I ended up loading backbone (and other libs) via ender. Browserify is still useful within the same project - just not being used to its possible max. Patching backbone.js seems like unnecessary maintenance...

Nice, I will look into ender. Thanks

…

On 7 September 2011 17:20, Orlin M Bozhinov < ***@***.***>wrote: I ended up loading backbone (and other libs) via `ender`. Browserify is still useful within the same project - just not being used to its possible max. Patching backbone.js seems like unnecessary maintenance... ## Reply to this email directly or view it on GitHub: https://gist.github.com/1151166

Just keep in mind require(...) is contentious - many would like to claim it. Right now, I require Ender-ed libs first. Browserify requires next.

You don't have to manually patch any libraries to make them browserifiable anymore.
browserify-shim takes care of that for you

Works with all libraries I have encountered so far.