將大型現有的base2 javascript應用程序代碼庫轉換爲使用RequireJS

我一直在研究JavaScript應用程序很長一段時間，它開始時相當小，我是唯一一個處理它的人。但是，它變得相當大。我想引入另一位開發人員來加速工作。將大型現有的base2 javascript應用程序代碼庫轉換爲使用RequireJS

問題是，這個應用程序只包含一個js文件（15000行代碼），在當前情況下在這個應用程序上一起工作會在合併我們的工作時帶來很多苦難（我使用git）。

該應用程序建立在Douglas Crockford的base2庫上。它還使用jQuery進行DOM操作，jQuery UI，Modernizr等等。

它的結構是這樣的：

App = {}; 
App.model = {}; 
App.view = {}; 
App.controller = {}; 

App.main = base2.Base.extend({ 
    // uses models, views, controllers 
}); 

App.model.AbstractModel = base2.Base.extend({ 
    constructor: function(){ ... }, 
    someMethod: function(){ ... } 
    // etc. 
}); 

App.model.AModel = App.model.AbstractModel.extend({ 
    // override some method 
    someMethod: function(){ ... } 
});

現在的問題是，作爲標題指出：（如何）我可以在更容易合作使用RequireJS，使這個應用程序的模塊化，由單獨的文件，用眼與其他開發人員？ RequireJS是一個不錯的選擇，還是應該走另一條路？

來源

2012-11-30 Asciiom

是的，我認爲這是一個很好的選擇路徑，它會改善代碼的質量和可維護性。

你的模塊拆分成單獨的文件
每個你找出模塊中的其他模塊之間什麼都依賴
您更改代碼模塊類似如下

從

App.model.AModel = App.model.AbstractModel.extend({ 
    // override some method 
    someMethod: function(){ ... } 
});

要

// I'm using shortened syntax here 
// http://requirejs.org/docs/api.html#modulenotes 
define(function (require) { 
    // here you are listing dependencies as local closure variables 
    var AbstractModel = require('model/AbstractModel'); 

    var AModel = AbstractModel.extend({ 
    // override some method 
    someMethod: function(){ ... } 
    }); 

    // here you are returning the module 
    return AModel; 
});

對於像jQuery這樣的依賴項，我們決定在SoundCloud中將它們縮小並連接爲全局變量（它們與常規腳本標記一起工作的方式），而不包括它們在AMD模塊定義中。

您還可能有主app.js，這將需要所有這些模塊，並揭開序幕應用：

require(
    ['models/amodel', 'views/main'/*, 'more', 'modules', … */], 
    function (Amodel, Main /*, more, modules */) { 
    new Main({ 
     model: Amodel 
    }); 
    } 
);

來源

2012-11-30 10:15:58

謝謝您的回覆！這看起來像我需要的，任何人都可以證實這是一個好方法？（在你的例子中，我應該返回AModel而不是AbstractModel？Typo？） – Asciiom

是的，這是一個錯字，對不起 –

至於像jQuery這樣的依賴關係，在SoundCloud中，我們決定將它們縮小並連接爲全局變量常規腳本標記），而不將它們包裝在AMD模塊定義中。 –

將大型現有的base2 javascript應用程序代碼庫轉換爲使用RequireJS

回答

相關問題