RequJS

के साथ एकाधिक पृष्ठों को कैसे व्यवस्थित करें RequJS के साथ एकाधिक पृष्ठों को कैसे व्यवस्थित करें? क्या, निम्नलिखित नमूना की तरह, app.js में प्रत्येक वर्ग की घोषणा करना सही बात है? <script data-main="src/main" src="src/require.js"></script> घोषित करने के लिए हर एचटीएमएल फाइल है?RequJS

जो मैं बचाना चाहता हूं वह सभी स्क्रिप्ट लोड कर रहा है जब उपयोगकर्ता किसी साइट के पहले पृष्ठ तक पहुंचता है।

main.js सभी बाहरी निर्भरता को परिभाषित:

require(
    { 
     baseUrl:'/src' 
    }, 
    [ 
     "require", 
     "order!http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js", 
     "order!http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js", 
     "order!http://ajax.cdnjs.com/ajax/libs/underscore.js/1.1.6/underscore-min.js", 
     "order!http://ajax.cdnjs.com/ajax/libs/backbone.js/0.3.3/backbone-min.js" 
    ], 
    function (require) { 
     require(["app"], function (app) { 
      app.start(); 
     }); 
    } 
);

app.js हर घटक को परिभाषित फ़ाइल:

define([ "product/ProductSearchView", 
     "product/ProductCollection" 
     ], function (ProductSearchView, 
         ProductCollection) { 
     return { 
      start: function() { 
        var products = new ProductCollection(); 
        var searchView = new ProductSearchView({ collection: products }); 
        products.fetch(); 
        return {}; 
      } 
     } 
});

स्रोत

2011-05-31 yves amsellem

आप अपने मौजूदा मॉड्यूल के भीतर फ़ाइलों की आवश्यकता कर सकते हैं। तो कहते हैं कि जब कोई किसी लिंक पर क्लिक यदि आप एक समारोह है कि निम्नलिखित करता है को चालू कर सकते:

// If you have a require in your other module 
// The other module will execute its own logic 
require(["module/one"], function(One) { 
    $("a").click(function() { 
     require(["new/module"]); 
    }); 
}); 

// If you have a define in your other module 
// You will need to add the variable to the require 
// so you can access its methods and properties 
require(["module/one"], function(One) { 
    $("a").click(function() { 
     require(["new/module"], function(NewModule) { 
      NewModule.doSomething(); 
     }); 
    }); 
});

स्रोत

2011-06-08 16:42:01 dbme

क्या 'नया/मॉड्यूल' नाम दिया जाना चाहिए? यदि ऐसा नहीं है, तो इसका उपयोग कैसे करें, कहें, इसकी 'साफ()' विधि? –

आह, और 'आवश्यकता' को किसी अन्य 'आवश्यकता' में होना चाहिए या क्या यह 'परिभाषित' ब्लॉक में दिखाई दे सकता है? –

यदि आप चाहें तो आप इसे नाम दे सकते हैं, उस स्थिति में आप नए/मॉड्यूल में परिभाषित करना चाहते हैं। मैं वर्तमान में नाम के बिना इसका उपयोग कर रहा हूं क्योंकि यह सिर्फ अपना तर्क चलाएगा। – dbme

यह है कि यह कैसे काम करता है सब की एक पूरी उदाहरण है; require.js और order.js ऐप की जेएस फाइलों के समान निर्देशिका में हैं।

<html> 
    <head> 
    <script data-main="js/test" src="js/require.js"></script> 
    </head> 
    <body> 
    <button>Clickme</button> 
    </body> 
</html>

test.js (जे एस फ़ोल्डर में)

require(
    { 
    baseUrl:'/js' 
    }, 
    [ 
    "order!//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js", 
    "order!//ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js" 
    ], 
    function() { 
    require(["app"], function (app) { 
     app.start(); 
    }); 
    } 
);

Employee.js की मांग पर भार के साथ app.js (जे एस फ़ोल्डर में):

define([], function() { 
    return { 
    start: function() { 
     $('button').button(); 
     $('button').click(function() { 
     require(['Employee'], function(Employee) { 
      var john = new Employee('John', 'Smith'); 
      console.log(john); 
      john.wep(); 
     }); 
     }); 

     return {}; 
    } 
    } 
});

कर्मचारी। जेएस (जेएस फ़ोल्डर में):

define('Employee', function() { 
    return function Employee(first, last) { 
    this.first = first; 
    this.last = last; 
    this.wep = function() { 
     console.log('wee'); 
    } 
    }; 
});

स्रोत

2011-06-15 15:55:47

उत्तर

संबंधित मुद्दे