Modular TodoMVC app with CanJS and RequireJS
Posted on August 26, 2012
To build modular JavaScript applications with CanJS and RequireJS is not as easy as it sounds. Because CanJS seems to have an incomplete support of AMD. To find a way to solve this issue I have refactored the official CanJS TodoMVC app for using CanJS and RequireJS.
Source code
Feel free to check out all source code, which is available at GitHub. Most of the code is written in CoffeeScript - just for fun.
Random notes
-
Because CanJS does not express dependencies via define() you have to use RequireJS' shim config.The downside of the shim config is, that you can not mix CDN loading with it in a build. Check the "Important optimizer notes for shim config" at the RequireJS API. - I had some issues with CanJS templated event handling. Event handler defined by using
{anyObject}seems not work with modules. So I added manual bindings, e.g.Todo.bind('created', function(ev, todo){ ... })to solve this issue. - Let's have Grunt does all the work for you. There are great Grunt tasks out there, e.g. for RequireJS. Here you will find the build script for the app.
Helpfull links
Update
Latest build of CanJS supports AMD - Thanks to @CanJS for the hint. The source has been updated.
-Jens