Problem

When executing compiled handlebars templates, the global Handlebars object is not exported. NOTE. the global Backbone object works.

See when the code App.templates.todos

tries to execute on the file todos.js

it fails because it is App.templates.todos

not defined. Ultimately, because the third line in the file templates.js

cannot be executed, because the global object is Handlebars

not defined.

Why not define this object? What did I do wrong with require.js here?

UPDATE: I have verified that the file handlebars.runtime.js

actually executes before the file templates.js

and therefore require.js

runs them in the correct order when the file is loaded todos.js

.

Bower components

{
  "name": "todomvc-backbone-requirejs",
  "version": "0.0.0",
  "dependencies": {
    "backbone": "~1.1.0",
    "underscore": "~1.5.0",
    "jquery": "~2.0.0",
    "todomvc-common": "~0.3.0",
    "backbone.localStorage": "~1.1.0",
    "requirejs": "~2.1.5",
    "requirejs-text": "~2.0.5",
    "handlebars": "~2.0.0"
  },
  "resolutions": {
    "backbone": "~1.1.0"
  }
}

      

        
        
        
      

    

main.js

/*global require*/
'use strict';

// Require.js allows us to configure shortcut alias
require.config({
    // The shim config allows us to configure dependencies for
    // scripts that do not call define() to register a module
    shim: {
        backbone: {
            deps: [
                'underscore',
                'jquery'
            ],
            exports: 'Backbone'
        },
        backboneLocalstorage: {
            deps: ['backbone'],
            exports: 'Store'
        },
        handlebars: {
            exports: 'Handlebars'
        },
        templates: {
            deps: ['handlebars'],
            exports: 'App'
        },
        underscore: {
            exports: '_'
        }
    },
    paths: {
        jquery: '../bower_components/jquery/jquery',
        underscore: '../bower_components/underscore/underscore',
        backbone: '../bower_components/backbone/backbone',
        backboneLocalstorage: '../bower_components/backbone.localStorage/backbone.localStorage',
        handlebars: '../bower_components/handlebars/handlebars.runtime',
        templates: '../../../templates',
        text: '../bower_components/requirejs-text/text'
    }
});

require([
    'backbone',
    'views/app',
    'routers/router'
], function (Backbone, AppView, Workspace) {
    /*jshint nonew:false*/
    // Initialize routing and start Backbone.history()
    new Workspace();
    Backbone.history.start();

    // Initialize the application view
    new AppView();
});

      

        
        
        
      

    

todos.js

/*global define*/
define([
    'jquery',
    'backbone',
    'handlebars',
    'templates',
    'common'
], function ($, Backbone, Handlebars, Templates, Common) {
    'use strict';

    var TodoView = Backbone.View.extend({

        tagName:  'li',

        template: App.templates.todos,

        ...
    });

    return TodoView;
});

      

        
        
        
      

    

templates.js

this["App"] = this["App"] || {};
this["App"]["templates"] = this["App"]["templates"] || {};
this["App"]["templates"]["stats"] = Handlebars.template({"1":function(depth0,helpers,partials,data) {