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

时间:2013-06-23 11:18:10

标签: jquery backbone.js requirejs

我正在尝试使用BackboneRequireJS合作,但我在查看来自jQuery的{​​{1}} $ var时遇到了问题。

这是require Backbone文件:

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"
    }
}
});

似乎使用此配置我看不到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; } ); ,我收到此错误:

$

我缺少什么?

1 个答案:

答案 0 :(得分:1)

在垫片中,添加jquery

例如

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