如何将此Coffeescript拆分为单独的文件？

Question

Using the Garber method for DOM execution:

SITENAME = {
  common: {
    init: function() {
      // application-wide code
    }
  },

  users: {
    init: function() {
      // controller-wide code
    },

    show: function() {
      // action-specific code
    }
  }
};

UTIL = {
  exec: function( controller, action ) {
    var ns = SITENAME,
        action = ( action === undefined ) ? "init" : action;

    if ( controller !== "" && ns[controller] && typeof ns[controller][action] == "function" ) {
      ns[controller][action]();
    }
  },

  init: function() {
    var body = document.body,
        controller = body.getAttribute( "data-controller" ),
        action = body.getAttribute( "data-action" );

    UTIL.exec( "common" );
    UTIL.exec( controller );
    UTIL.exec( controller, action );
  }
};

$( document ).ready( UTIL.init );

How could I use this technique in separate .coffee files ala Rails pipeline?

I want to do the following

users.js.coffeee

SITENAME =
  users:
    init: ->
      alert("nope")

    index: ->
      alert("hi")

But if I do that now, it just rewrites it and forces me to keep it all in one file.

How can I split it up and use namespacing for each page in this technique?

Answer 1

First, make sure you're including it in the application.js manifest file:

//= require global
//= require users

Where global.coffee holds your utility methods. Your example users.coffee looks fine. However, you'll need to scope SITENAME to window so that it's accessible across the board.

// global.coffee
window.SITENAME = ...

// users.coffee
window.SITENAME.users = ...

You'll need to do this because CoffeeScript will compile each file within it's own closure... thereby limiting scope unless you explicitly assign it to window.

(function() {
  window.SITENAME.users = {};
}).call(this);