我試圖實現一個極端的基本測試,使用jquery,underscore.js和backbone.js加載通過require.js和由於某種原因,我似乎無法讓一切正常排列。研究表明,其他人沒有這些相同的問題,所以我知道它一定是簡單的,我只是沒有看到。通過Require.js問題非常基本的骨幹/下劃線驅動我batty
我遇到的問題是,當backbone.js加載時,它無法找到對_的引用。我發現其他人報告了同樣的問題,但問題通常是將錯誤順序或其他明顯問題的依賴關係引用傳遞給處理程序。骨幹網正在加載時發生這種情況。
我也看到了一些'機械'解決方案,比如'將所有內容放在同一個文件中',只是通過使用一些腳本以正確的順序包含傳統方式來加載它們,但我真的很想因爲它似乎是一個如此強大的方法。
最初我從這裏的結構http://backbonetutorials.com/organizing-backbone-using-modules/開始,它在演示中工作,但感覺有點脆弱,因爲當我試圖做出非常簡單的修改或從頭開始構建一個簡單的示例時,它會中斷。
打我的頭這太長了,我回去了,發現這個網頁 Loading Backbone and Underscore using RequireJS 另一個簡單的例子,我希望恢復。然而,在建立一個基於它的新測試之後,即使骨幹的0.5.3-optamd分支應該處理它自己對下劃線的依賴關係,我仍然會收到同樣的問題。
不用再說了,這裏是超級直接的代碼,應該可以工作,但卻讓我瘋了。在這裏我們希望這件事情很明顯我只是錯過莫名其妙:
的index.html
<!DOCTYPE html>
<html>
<head>
<title>Backbone.js/Underscore.js via Require.js Learning Page</title>
<script src="js/libs/require/require.js"></script>
<script src="js/main.js"></script>
</head>
<body>
<div>Backbone.js/Underscore.js via Require.js Learning Page</div>
<div class="testhook"></div>
</body>
</html>
的js/main.js
require.config({
paths: {
'jquery': 'libs/jquery/1.7/jquery',
'underscore': 'libs/underscore/1.2.2/underscore',
'backbone': 'libs/backbone/0.5.3-optamd/backbone'
},
baseUrl: '/js',
urlArgs: 'v=1.0'
});
require([
'domReady',
'app'
],
function(domReady, App){
domReady(function(){
console.log('Dom is ready');
App.init();
});
}
);
的js/app.js
// Filename: app.js
define([
'jquery',
'underscore',
'backbone'
],
function($, _, Backbone){
var init = function(){
console.log('app.js > init()');
// jquery test (WORKS)
$('.testhook').append('testhook append');
// underscore test (WORKS)
console.log(_.map([1, 2, 3], function(n){ return n * 2; }));
// backbone test (DIES)
var artist = new Backbone.Model({
firstName: "Wassily",
lastName: "Kandinsky"
});
artist.set({birthday: "December 16, 1866"});
console.log(JSON.stringify(artist));
}
return { init: init };
}
);
確切控制檯輸出是:
Uncaught TypeError: Cannot call method 'extend' of undefined (backbone.js:150)
main.js:18 Dom is ready
app.js:11 app.js > init()
app.js:17 [2, 4, 6]
app.js:20 Uncaught TypeError: Cannot read property 'Model' of null (app.js:20)
NOTE:
Line 150 in unminified backbone.js is:
_.extend(Backbone.Model.prototype, Backbone.Events, {
我在使用Chrome 17.0.938.0 dev-m的Windows 7機器上。
我的腳本版本是:
backbone: 0.5.3-optand
jquery: 1.7
require: 1.0.1
underscore: 1.2.2
我的目錄結構是:
js
+-- libs/
¦ +-- backbone/
¦ ¦ +-- 0.5.3-optamd/
¦ ¦ +-- backbone.js
¦ +-- jquery/
¦ ¦ +-- 1.7/
¦ ¦ +-- jquery.js
¦ +-- require/
¦ ¦ +-- require.js
¦ +-- underscore/
¦ +-- 1.2.2/
¦ +-- underscore.js
+-- app.js
+-- domReady.js
+-- main.js
+-- order.js
index.html
我不能相信這是多麼困難,給我和我真的希望有人能揭示一些輕什麼heck正在這裏。
你的榜樣爲我工作100%。你使用了什麼確切的Backbone版本? optamd或optamd3? – Riebel