2011-12-30 10 views
13

मैं अपने backbone.js आधारित एप्लिकेशन को व्यवस्थित करने में सहायता के लिए require.js का उपयोग कर रहा हूं।requ.js के साथ गैर-एएमडी संगत जावास्क्रिप्ट मॉड्यूल का उपयोग करना?

मैं सही तरीके से एक 3 पार्टी जावास्क्रिप्ट पुस्तकालय है कि require.js

सवालों में पुस्तकालय backbone-tastypie.js है साथ एएमडी संगत नहीं है का उपयोग करने के यह पता लगाने की कोशिश कर रहा हूँ। मूल रूप से लाइब्रेरी क्या करता है बैकबोन के कुछ प्रोटोटाइप तरीकों को बंद कर देता है ताकि TastyPie Django REST ढांचे के लिए सरल समर्थन प्रदान किया जा सके। यह वैश्विक नामस्थान में बैकबोन ऑब्जेक्ट को सीधे जोड़कर करता है।

हालांकि, चूंकि मैं backbone.js को require.js मॉड्यूल के रूप में उपयोग कर रहा हूं, यह तब उपलब्ध नहीं है जब यह लाइब्रेरी इसे एक्सेस करने का प्रयास करे।

बैकबोन के दायरे में इस रीढ़ की हड्डी-स्वाद को आयात करने के बारे में मैं कैसे जा सकता हूं?

उत्तर

12

अद्यतन: मैं एक AMD संगत रीढ़-tastypie backbone-tastypie-amd.

Sander समाधान काम करेगा जबकि कहा जाता है, इसकी एक छोटे से परेशान पूरे नेस्ट करने के लिए आवश्यक बात हर बार जब आप रीढ़ चाहते अलग किया गया है।

रीढ़ की हड्डी-tastypie जिसे "पारंपरिक लिपि" कहा जाता है। आप इस मुद्दे को 4 तरीकों से हल कर सकते हैं।

  1. रीढ़ की हड्डी-tastypie एएमडी स्वयं को संगत बनाओ। आप इसे दो तरीकों से कर सकते हैं। विकल्प 1 में सीधे रीढ़ की हड्डी शामिल नहीं होगी - केवल रीढ़ की हड्डी-tastypie। फिर रीढ़ की हड्डी की आवश्यकता सुनिश्चित करने के लिए रीढ़ की हड्डी tastypie संशोधित करें।

    var root = this; 
    var Backbone = root.Backbone; 
    if (!Backbone && (typeof require !== 'undefined')) Backbone = require('backbone').Backbone; 
    

    हालांकि इस वजह से अनिवार्य रूप से इसे डाउनलोड करने के रीढ़ की हड्डी शुरू कर देंगे के बाद रीढ़ की हड्डी-tastypie लोड होते ही (तुल्यकालिक) बहुत अच्छा नहीं है। यह ज़रूरतों को पूरी तरह से समझ नहीं देता है कि ये मॉड्यूल कैसे संबंधित हैं, और यह सही है? तो एक को परिभाषित() में रैप रीढ़-tastypie करने देता है:

    (function (factory) { 
         if (typeof define === 'function' && define.amd) { 
           // AMD. Register as an anonymous module. 
           define(['backbone'], factory); 
         } else { 
           // RequireJS isn't being used. Assume backbone is loaded in <script> tags 
           factory(Backbone); 
         } 
    }(function (Backbone) { 
         //Backbone-tastypie contents 
    })); 
    

    यह अभी तक इस जवाब में सब कुछ से बाहर सबसे अच्छा विकल्प के द्वारा होता है। RequJS निर्भरताओं के बारे में जानता है और यह उन्हें हल कर सकता है, उन्हें डाउनलोड कर सकता है और उन्हें सही तरीके से मूल्यांकन कर सकता है। यह ध्यान देने योग्य है कि बैकबोन स्वयं विकल्प 1 का उपयोग करके अंडरस्कोर लोड करता है और खुद को मॉड्यूल के रूप में परिभाषित नहीं करता है, जो कि बहुत खराब है। आप रीढ़ की हड्डी right here. का एएमडी अनुकूलित संस्करण प्राप्त कर सकते हैं मान लें कि आप इस एएमडी संस्करण का उपयोग कर रहे हैं, अब आप आगे बढ़ सकते हैं और अपने ऐप में रीढ़ की हड्डी-टेस्टीपी की आवश्यकता होती है (या तो इसे परिभाषित() या वास्तविक आवश्यकता() फ़ंक्शन में आवश्यकतानुसार)। आपको रीढ़ की हड्डी या अंडरस्कोर को शामिल करने की आवश्यकता नहीं है, क्योंकि उन निर्भरताओं को requjs द्वारा हल किया जाता है।

  2. require.js ordering plugin का उपयोग करें। इस क्रम में लोड करने के लिए चीजों को मजबूर करता (अभी भी कुछ मामलों में अतुल्यकालिक क्योंकि यह उन्हें डाउनलोड करता है जब भी, लेकिन सही क्रम में मूल्यांकन करता है)

    priority config में
    require(["order!backbone.js", "order!backbone-tastypie.js"], function() { 
        //Your code 
    }); 
    
  3. रखें backbone.js। यह बैकबोन और इसकी निर्भरताओं को हमेशा पहले लोड करने के लिए मजबूर करता है चाहे कोई फर्क नहीं पड़ता।

  4. रीढ़ की हड्डी-tastypie को backbone.js के समान फ़ाइल में संलग्न करें। हर बार रीढ़ की हड्डी लोड होती है, तो रीढ़ की हड्डी tastypie है। Hacky? हाँ। लेकिन यह jquery with requireJS का उपयोग करने के अनुशंसित तरीके से बहुत ही समान है (jquery प्लगइन्स को लोड करने के लिए jquery की आवश्यकता होती है - बैकबोन-टैस्टपी को लोड करने के लिए रीढ़ की हड्डी की आवश्यकता होती है)।

2

आप अपनी आवश्यकताएं किसी अन्य आवश्यकता के साथ प्लगइन पहले लोड कर लेंगे, और बाद में आप अपना ऐप कर सकते हैं।

require(["myCustomTastyPiePlugin.js"], function() { 
    //This callback is called after the one script finish loading. 

    require(["one.js", "two.js", "three.js"], function() { 
     //This callback is called after the three scripts finish loading. 

     // all your code goes here... 

    }); 
}); 
+0

मैं अभी भी सीख रहा हूँ एएमडी, लेकिन यह इस नेस्ट डाल करने के लिए संभव हो जाएगा एक अलग लिपि में बयान की आवश्यकता होती है, और एक समग्र वस्तु के सदस्य के रूप में संयुक्त उचित वस्तुओं वापसी? यदि यह काम करेगा तो आपको केवल एक फ़ाइल की आवश्यकता होगी जब भी आपको दोनों की आवश्यकता हो। – user4815162342

+0

आप ऐसा कर सकते हैं हाँ, आप ऑर्डर प्लगइन का उपयोग करके उन्हें 1 ब्लॉक में जोड़ सकते हैं, यह सुनिश्चित करने के लिए कि वे सही क्रम में लोड हो जाएं। बाद में आप उन्हें बनाए गए 1 नए मॉड्यूल के 2 गुणों के रूप में वापस कर सकते हैं। मेरे exmaple की तरह, आप एक नए मॉड्यूल के गुण के रूप में one.js, two.js और three.js का परिणाम वापस कर सकते हैं। वापसी {एक: एक, दो: दो}; – Sander

+0

धन्यवाद, यही मैंने सोचा था। – user4815162342

9

निम्न आवश्यकताएँ 2.1.0+ के साथ काम करना चाहिए मानते हैं कि आपने सही तरीके से पथ स्थापित किए हैं।

require.config({ 
    shim: { 
    'underscore': { 
     exports: '_' 
    }, 
    'backbone': { 
     deps: ['underscore','jquery'], 
     exports: 'Backbone' 
    }, 
    'backbone-tastypie': { 
     deps: ['backbone'] 
    } 
    } 
); 
संबंधित मुद्दे