2013-06-23 59 views
0

我試圖用RequireJS,但我有從Backbone看到jQuery$ VAR問題Backbone工作正確設置骨幹和jQuery。如何使用RequireJS

這是需要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; 
} 
); 

似乎與這個配置我看不到$和我得到這個錯誤:

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

我失蹤了什麼?

+0

沒有助手要求骨幹? –

回答

1

在墊片,加入jQuery的

例如

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

感謝您的建議,我試了一下,但它鋼鐵不行,在網絡控制檯中似乎一切正常加載,但'骨幹'似乎首先比'jquery'。 – vitto

+0

給出的信息不完整。其他一些設置仍然是必需的。是否有任何理由需要把這個:requireLib:「libs/require/require-2.1.6-min」? –

+0

不,我已經刪除它,但它仍然無法正常工作,也從未加載過它。 – vitto