how do I use coffeescript with an AMD loader and a node server?

Http Server: node.js 0.8.16
source files: mix of js and coffee
AMD loader: curl / require
Markup: jade 
CSS: styl

I'm building a prototype app using the above setup. It's all working fine, but I'm working on getting an AMD loader integrated with the app. The assets folder looks like this:

|____assets                                                    
| |____css                                                     
| | |____style.css                                             
| | |____style.styl                                            
| |____img                                                     
| |____js                                                      
| | |____bacon.js                                              
| | |____curl.js                                               
| | |____foo.coffee                                   
| | |____index.coffee

OK so I want to get index.coffee and foo.coffee to be compiled as js and served when the browser requests /js/foo.js etc. This would work fine if I used connect-assets and put != js('foo') in my jade markup. But that != js( is kicking off connect-assets compilation, which is (I think) on the fly compiling the coffee file to js.

But if I use curl with a path like "foo" : "/js/foo.js" it won't work because connect-assets' js() method isn't kicking off.

Is there a middleware for node that will handle requests for coffee files as js files? I've looked a bit and connect-assets was the closest I could find.

I'd like to avoid having to set up a 'watcher' on my coffee files. Since I'm using some js files and some coffee-as-js files, I don't want to have to keep track of where the 'real' js files are and where the 'on-the-fly' js files are.

Update 5/24: I ditched all the middleware fiddle-faddle and went with grunt with a watcher that compiles stuff when it changes. Works great.

Yep, a duplicate, mostly. I'll answer it anyway in case this helps someone else down the road.

https://github.com/wdavidw/node-connect-coffee-script

var app = express();

srcFolder = path.join(__dirname, 'assets', 'src', 'coffee');
publicFolder = path.join(__dirname, 'assets');
console.log("public folder: " + publicFolder);

app.configure(function(){
  app.set('port', process.env.PORT || 3000);
  app.set('views', __dirname + '/views');
  ...
  app.use(require('connect-coffee-script')({
         src: srcFolder, dest: path.join( publicFolder, 'js')
  }));

  app.use(stylus.middleware ({
    debug: true,
    force: true,
    src: path.join(__dirname, 'assets', 'src', 'styl' ),
    dest:  path.join(__dirname, 'assets', 'css')})
  );

  app.use(express.static(publicFolder));
});

Then on the layout.jade side: 

script
  curl = {
        baseUrl: "/js",
        paths: {
          "jquery": "//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.0/jquery.min.js",
          "foo" : "foo.js",
          "index" : "index.js",
          "bacon" : "bacon.js"
        }
      };
script(src='/js/curl.js')
script
  //debugger; 
  curl(['js!jquery', 'js!bacon', 'js!foo!order', 'js!index!order'])
    .then(function(){
          console.log("scripts loaded");
          },
        function(){
          alert("a module failed to load");
         });

I will provide another solution, it is not a connect middleware. I wrote the tool - camel for using coffeescript with requirejs AMD-style loader.

To use camel, you can just:

  • npm install camel
  • camel YOURPROGRAM.coffee

YOURPROGRAM.coffee should be written in AMD style.

For small example you can check with:

For Big example you can check with:

It use camel with AMD-style library, WebWorkers in server side and other HTML5 cases, all the code is in CoffeeScript.