如何使用RequireJS正确设置Backbone和jQuery

Question

我正在尝试使用RequireJS来处理Backbone，但是在Backbone中看到jQuery $变量时遇到了问题。

这是所需的config.js文件：

require.config({
baseUrl: "js",

paths: {
    // Aliases for libraries, so that we can change versions from here
    jquery: ["libs/jquery/jquery-1.9.1.min", "libs/jquery/jquery-2.0.2.min"],
    handlebars: "libs/backbone/template/handlebars",
    lodash: "libs/backbone/template/lodash.min",
    requireLib: "libs/require/require-2.1.6-min",
    backbone: "libs/backbone/backbone-1.0.0.min",
    less:"libs/less/less-1.4.0-beta.min",
    helper:"app/helper",
    text:"libs/require/text-2.0.7"
},

shim: {
    "lodash": {
        exports: '_'
    },
    "backbone": {
        //These script dependencies should be loaded before loading
        //backbone.js
        deps: ["helper", "lodash", "jquery"],
        //Once loaded, use the global "Backbone" as the
        //module value.
        exports: "Backbone"
    },
    "jquery_cookie": {
        deps: ["jquery"],
        exports:"$"
    },
    "less": {
        exports:"less"
    }
}
});

这是我的backbone的视图文件：

define([
"jquery",
"handlebars",
"lodash",
"helper",
"backbone",
"app/models/status_message",
"text!app/templates/status_message.php"
],

function ($, Handlebars, _, Helper, Backbone, StatusMessageModel, tmplStatusMessage) {

    var StatusMessageView =  Backbone.View.extend({
         events: {
            'click ': 'closeMessage'
        },
        initialize:function () {
            console.log("StatusMessageView.initialize");
            this.template = tmplStatusMessage;
            this.model = new StatusMessageModel();
            this.model.bind("change", this.render);
        },
        render:function () {
            //console.log("StatusMessageView.render");
            //console.log(this);

            var template = Handlebars.compile(this.template);
            var html = template(this.model.toJSON());

            if($("#status-message").length === 0) {
                $("body").append($(this.el).attr("id", "status-message").html(html));
            } else {
                $(this.el).attr("id", "status-message").html(html)
            }

            var self = this;
            var intro_timer = setTimeout(function () {
                $("#status-message").addClass("enter");

                var outro_timer = setTimeout(function () {
                    self.closeMessage();
                }, 5000);
            }, 500);
        },
        closeMessage:function () {
            $("#status-message").removeClass("enter");
        }
    });
    return StatusMessageView;
}
);

似乎在这种配置下，我看不到$，并且我得到了这个错误：

Uncaught TypeError: Property '$' of object #<Object> is not a function

我错过了什么？

Answer 1

在填充程序中，添加jquery

例如

shim: {
    "jquery": {
        exports: '$'
    }
}